Eric (Meng Chen) Liu / IDES 4400 Internship Report / 2014

This report discusses my experience working with MicroMetrics, a tech start-up company who utilizes user-centered UI/UX design for an SaaS (software as a service) solution to collect data from brick and mortar businesses customers. The report includes observations on the role of user-centred design in the product development process, as well as characteristics unique to a start-up business and digital product development, such as having a close-up look at all the other departments in the small team and Scrum and Agile methodology’s effect on the designer.

Table of Contents 1. Company

1.1 About MicroMetrics............................................................................................................................ 1.2 Industry Sector...................................................................................................................................... 1.3 Size and Makeup................................................................................................................................. 1.4 Relevant Departments......................................................................................................................

2. Internship Responsibility and Roles

2.1 Work Performed................................................................................................................................... 2.2 Chain of Command............................................................................................................................ 2.3 Skills and Knowledge Required................................................................................................... 2.4 Product Outcomes.............................................................................................................................. MicroMetrics Web-App and Mobile-App............................................................................. Call-to-action Graphics for iPadKiosks.................................................................................. Business Brochures and Sales Pitch Presentation Deck.............................................

3. Relationship between Education and Professional Practice

3.1 Analysis of Difference........................................................................................................................ 3.2 Feedback Opportunities.................................................................................................................. 3.3 Advantages............................................................................................................................................

4. Other

4.1 Start-up Environment........................................................................................................................ 4.2 Digital Product Development........................................................................................................

5. Discussion

5.1 How to Prepare..................................................................................................................................... 5.2 What to Expect...................................................................................................................................... 5.3 How to Optimize the Experience.................................................................................................

1122

3333456

778

101011

99

List of Figures Figure 1.1 The MicroMetrics team photo in Invest Ottawa’s Grindspace

Figure 2.1 The MicroMetrics web-app and mobile-app

Figure 2.2 A sample screen from MicroMetrics mobile-app survey

Figure 2.3 Two different sizes of the sample call-to-action graphics, which can be customized according to the needs of the clients

Figure 2.4 Back-end developer Anton doing a survey on the iPadKiosk with the call-to-action graphics

Figure 2.5 Sample slides from business brochures and the sales pitch deck

Figure 3.1 Co-CEO Martin Kratky-Katz holding a MicroMetrics team meeting

Figure 4.1 The MicroMetrics team doing networking in the Invest Ottawa incubator

1

1. Company

1.1 About MicroMetrics

MicroMetrics, legal name Micro Metrics Inc., was founded in March 2013 by Martin Kratky-Katz and Artem Abramov, and has continued to grow since then. Martin, a distinguished business academic and entrepreneur who has won lots of pitch competitions, had co-founded another start-up before (an online social platform for politics & constituency management system for politicians), while Artem has extensive experience working with Chinese businesses and investors. Both of its co-founders had worked in sales for cloud-based software services, and therefore, have insights in the business intelligence industry sector.

The business idea happened one day when they were standing in a coffee shop with laminated QR codes around the store, and they realized how inefficient the current survey solutions are. Later, they put this idea of starting their own business into action, to address a common real-world problem many brick and mortar retail businesses face. They started the business as one of Invest Ottawa’s portfolio companies, and they are still one of the fastest growing companies in the program.

MicroMetrics’s central mission is to help offline businesses get better business insights by collecting more data from customers on the spot. With more efficient ways to gain customer insights, it allows businesses to achieve organizational goals, improve marketing and drive more sales. The

company now partners with Ottawa Health Group, PopEyes, Direct Buy, and more brick and mortar businesses that are looking for more innovative service solutions.

1.2 Industry Sector

MicroMetrics belongs to the business intelligence service industry sector, offering a software as a service (SaaS) solution through a web application and a mobile application. Its competitors range from traditional survey tools like receipt-based surveys and QR code surveys, to more contemporary web-based and mobile-based tools like FluidSurvey, Survey Monkey, ResponseTek, Typeform, and Benbria. The main challenge in the industry is that collecting data from customers is extremely hard, and the response rates are very low. The traditional receipt-based, web-based, or even the more recent mobile-based surveys, all have very low response rates, ranging from 2-4%. But MicroMetrics’s solution is able to achieve 5 times the average of data collection rate (around 20% response rate from MicroMetrics first product).

Given that tech start-ups are very competitive, and a lot of them don’t make it past their first winter, but MicroMetrics’s product solution is innovative enough at solving the real world problem and enticing enough for customers that they are growing in their industry and continuing to have more clients on board with this novel service.

2

1.3 Size and Makeup

Being a fast-growing start-up, MicroMetrics has gone through quite a bit of expansion and personnel changes. By the time I left the company, it has 13 full-time paid employees, plus the advisers and part-time employees. Artem and Martin are the Co-CEOs and they take care of the sales, marketing, public relations and finances, while Tomasz Ogrodzinski, the CXO, and Andre Richards, the CTO, are in charge of the product development. The Co-CEOs led the sales team and the marketing team, the CXO lead the design team, and the CTO lead the development team. Part-time employees, The company also has a few industry advisors, like Jay Proulx from Adobe, and Ron Gagnier who worked in IBM. Because the company is very small and connected, everyone knows each others on a first-name basis, and there is certainly no feeling of isolation from the other teams.

1.4 Relevant Departments

The design team was led by Tomasz Ogrozinski and consisted of 2 other full-time designers and myself. The development team works very closely with the design team to implement the designs, and the design team needs to consult the development team about any possible features. The development team was led by Andre Richards, and consisted of 4 full-time developers (front-end, back-end and mobile), and 3 part-time developers. I had worked with all of them to consult the feasibility of the digital product features. The design department also deals with the sales and marketing team to make marketing materials they need to present to the investors or potential clients, such as business brochures, pitch deck, and website graphics. The sales team also acted as a good second-hand resource about our potential clients and their needs, since what they deal with all the business clients first-hand and have a good idea of what the clients are looking for.

Figure 1.1 The MicroMetrics team photo in Invest Ottawa’s Grindspace

3

design the next set of features, at the same time when they produce graphics needed for the current feature implementation.

2.3 Skills and Knowledge Required

Working as a Graphic Designer, it is essential to have a strong portfolio with focus on visual design and typography to demonstrate your visual communication skills. Medium to high level of skills in Adobe softwares like Photoshop and Illustrator, as well as Microsoft Words and PowerPoint, are imperative for the designer to integrate into a digital workflow. More, working knowledge of user experience and user-centered design principles come in handy when generating insights and evaluating the features of the digital products. It is also important to have experience or at least a strong interest in software and web related design. Knowledge of front-end web development code languages like HTML/CSS/JQuery can also be an asset, given the UI/UX concepts need to be implementable with the capability of the codes. At last but not least, because of the interconnected structure of a start-up team, the designer needs to be flexible, creative and adaptable to different situations, and be able to communicate with the team effectively and manage the tasks efficiently.

2.4 Product Outcomes

During the 6-month internship, I have worked on 3 extensive digital projects in total, plus inputs in marketing materials and web graphics. This section includes a selected few of the projects I worked on during my internship, and in the interest of protecting the confidentiality of the company, it does not include the company projects that are not to be disclosed to the public.

2.1 Work Performed

My official role at the company was a Graphic Designer, and the works I performed during the internship ranged from rough concepts to highly detailed visuals. I engaged with the team in the ideation process for new features, products, and solutions, and then worked with product development team and user experience professionals to develop wireframes. I created UI designs from quick, low fidelity wireframes using sketches and Adobe Illustrator, to pixel-perfect, high fidelity look-and-feel mock-ups for websites, web-based softwares and mobile apps. From there, I created graphic artifacts for front-end and mobile developers to implement. More, I produced compelling marketing materials, and designed beautiful graphics for use on the company’s blog and affiliate sites.

2.2 Chain of Command

I worked under the direct supervision of the CXO Tomasz, and most of the tasks and assignments came from him. The CTO Andre, who put on developmental constraints and technological requirements, and co-CEO Artem, who set business objectives and time constraints, worked and negotiated with Tomasz to set priorities for the projects, and then Tomasz would assign tasks based on the result of discussions. Also, the design and development team employed Scrum and Agile methodology to develop the digital products. What that means is that every coder, developer and designer has a say to which task they feel best qualified to do. During the weekly meetings facilitated by Andre, who is also the Scrum master, everyone on the teams including the team leaders would create tasks based on the current development status, and then each choose the relevant tasks according to our abilities. The team leaders would work with team members in this rather democratized and time-focused process to assign everyone the appropriate tasks. The designers in this process, however, sometimes need to think ahead of the weekly meetings to

2. Internship Responsibilities and Role

4

MicroMetrics web-app and mobile-app

MicroMetrics web-app and mobile-app are the company’s first and main product offering. It provides the tools brick and mortar businesses need for their customers to fill out a quick survey on the spot on a mobile device like an iPad. The surveys are designed to be quick (less than 8 questions), incentivized (the survey taker would get a reward, eg. a coupon, when they fill out their email at the end of the survey) and on-the-spot. The apps are able to get response rates ranging from 10-20%, around 5 times the industry average.

The business owner can go on the MicroMetrics web-app to manage, control, deploy, and customize surveys and rewards from top to bottom. The mobile-app on the in-store iPads are synced in real time with the web-app as the customers fill out the surveys. The business owners can then run different surveys at different times, and access and view the results in real-time.

Although the main concept of this product was formed before the start of my internship, it went through quite a few iterations that incorporated new features and look-and-feel based on the user-testing results and new business objectives. We built look-and-feel mock-ups in Illustrator and photoshop, and tested the coded prototypes in pilot stores, trade-shows and open-houses. The design process of this product is a typical design thinking framework of convergent and divergent ideation, test and re-iteration. This product is also

designed using Bootstrap (a mobile first web design framework), and Agile methodology to implement the intended design feature by feature.

There were quite a few unique problems we faced when designing this product, and using a design thinking framework and Agile methodology, we achieved the objectives of the project with efficiency and efficacy.

Figure 2.1 The MicroMetrics web-app and mobile-app

Figure 2.2 A sample screen from MicroMetrics mobile-app survey

5

Call-to-Action Graphics for iPadKiosks

This accessory is offered as part of the MicroMetrics service to get customers’ attention in the brick and mortar stores. As a solution to the low product presence problem of the in-store iPads and iPad stands, the team decided to provide clients the service of designing the call-to-action graphics for them. Using the guidelines provided by iPadKiosks (whose iPad stands the company use for installing the iPads in store), the design team made design templates for businesses in different sectors, and also customized designs for specific events.

Figure 2.4 Back-end developer Anton doing a survey on the iPadKiosk with the call-to-action graphics

Figure 2.3 Two different sizes of the sample call-to-action graphics, which can be customized according to the needs of the clients

6

Business Brochures and Sales Pitch Presentation Deck

Aside from the digital product offerings of the company, I also contributed to some accompanying graphics for the sales and pitches. For example, the design team made sales brochures targeting different industry sectors, and the pitch deck for important investors. The graphics were made in Illustrator and Photoshop, then assembled to a PDF in InDesign or PowerPoint format at easily transferable sizes. The documents aim to add visual stimuli to aid the communications of the sales and pitch presentations.

Figure 2.5 Sample slides from business brochures and the sales pitch deck

7

3.1 Analysis of Differences

First and foremost, in professional practice, the technological and business constraints become glaringly real and immediate. In school projects, although there are a lot of efforts to emulate the realism of the constraints, they were no way as gripping as the constraints in the professional world. The unpredictability and unexpectedness of a lot of the tasks I got assigned during my internship, and the crunched up timeline for development, were all results of trying to meet a particular business requirement. At school, there is also a lot more autonomy in the direction of your own school projects, but in actual design practices, you have to make a lot of compromises based on what is reasonable with the resources at hand and the time-frame you have.

Secondly, the professional world is a very team-oriented environment, and there are a few implications. In a business-driven and professional setting like this, management on the team and individual levels takes on a new level of importance. Working with multiple designers on the same project means that the organization of individual works and files matters a great deal to the general productivity of the whole team. More, the frequency and clarity of communications needed for your opinions to be heard and for the project to work become a lot more important than when you are at school. Unlike working with the professors and school project teams, which happen perhaps once a week, your work is always under review, and you are constantly changing your designs based on the feedbacks. Communications between team members becomes lot more central to the development of the project. The reassuring thing about working in a professional team though, is that there are a lot more experts within reach who can quickly answer your questions about the feasibility of your design.

The professional practice can also be a lot more intense and fast-paced than school. You could

3. Relationship Between Education and Professional Practice

see how stressed out people are about meeting the business objectives, because it may mean a dead-or-alive situation for them. Working under pressure takes on a new meaning in professional practice. Unlike in school where design research is immensely valued, people who work at non-design departments may not see its value that much, and there also was not a lot of space for design research in a crunched-up product development timeline. The CXO and design team in MicroMetrics had to really convince other members on the team the value of design thinking, and push for rooms to do design researches and testings.

3.2 Feedback Opportunities

I think it would have been helpful to my work during the internship if I had taken Aspect of Product Design Methodology (PSYC 4800), which teaches a lot about human-computer interactions and even some basics about codes. I had to do a lot of learning on my own to catch up with the demand of the job, even with mentoring from the CXO.

There could perhaps be a third year UI/UX design elective that are in the same category as packaging design and exhibition design. The course may offer insights to digital product development and involve students making interactive prototypes using tools like InDesign and After Effect. In this way, the students who are interested in having another option of being a UI/UX designer (which is increasingly in demand nowadays) will have some industry-specific skills on their resumes and relevant works in their portfolios.

Also, it would be great to have more lectures or workshops that helps the students build their typography and graphic layout skills, as well as how to use InDesign. These skills would really come in handy in designing any print or information based materials.

8

3.3 Advantages

Although the title stated Graphic Designer, the company believed an Industrial Designer may be a better fit because they design with users in mind. Indeed, thanks to 3rd Year Major Studio and Design and the User, I had approached the internship design challenges with actual end-users in the focus. It also helped me better understand the product design process and design thinking (convergent and divergent ideation).

There are also other courses in the school that prepared me for this internship in different ways. Packaging Design gave me a better understanding of graphic design principles and strengthened my graphic design skills, ranging from the use of

hierarchy in typography to understanding when to use what type of PDF format. Professional Practice made me understand the importance of collaboration in the professional world and the importance of intellectual property, and also how to market myself as a designer.

Finally, my psychology minor definitely helped me a lot with this internship. Having taken Research Method and Introduction to Statistics, I could have a better idea of how collecting and analyzing data work, and also I could evaluate which features and metrics are important to the web-app. I also think it made me stand out in the interview process because the company knows that knowledge about research and statistics is desirable in the context of this job.

Figure 3.1 Co-CEO Martin Kratky-Katz holding a MicroMetrics team meeting

9

4. Other

4.1 Start-up Environment

There are a few distinct characteristics of working in a start-up environment like MicroMetrics. Working closely with other departments in small teams, I got a very close and first-hand look at the business side of things. I heard a lot of conversations about the constantly new business goals we needed to meet. There were a lot of talks between the co-CEOs and team leaders about getting investors, fundings, good clients, and how important building the product innovatively is essential to getting all the important financial resources. While working there, I realized that a big corporation is essentially a scaled-up and expanded version of this small company.

The company is full of excellent salesmen. Even Tomasz, the CXO, had worked in sales. All of them can give a persuasive elevator pitch on a whim with their excellent story-telling skills. In my opinion, this characteristic really helps achieve the success of the company. They are also very resourceful and hard-working. They networked like crazy, worked 70+ hours, and in turn found a lot of advisors and people who are on board with their projects. Even myself, established a few connections with entrepreneurs and professionals in other start-ups while working in an incubator environment.

4.2 Digital Product Development

Although there are a lot of similarities between physical product development and digital product development, there are still a few distinct characteristics digital product development possesses. One of the biggest differences between physical and digital products is how fast the prototyping and testing could go. It may take weeks to months for a physical product part to be made, shipped and tested, but with codes, it may only take a few hours or days to have a feature built up and running. The feedback loop is very fast and rewarding, because the product is built feature by feature according to your design, and is constantly updating and re-iterating.

Also, Scrum and Agile methodology worked in a way that let everyone utilize the best of their skills and offered transparency in the workflow of the team. This process really promoted connectedness and cross-pollination. I was always aware of what everyone else was working on, and in turn I could see all the nuts and bolts in the development of the product. Working cross-disciplinary like this definitely strengthened my knowledge about the making of a digital product.

Figure 4.1 The MicroMetrics team networking in the Invest Ottawa incubator

10

5. Discussion

5.1 How to Prepare

In terms of using what was taught in school in preparation for this internship, I definitely reviewed the user-centred design literature I have collected during school, also materials about design thinking and user testing. But given that this internship did not fall into the traditional industrial design field, there were some industry-specific skills and knowledge I had to acquire by myself. These include an understanding of human-computer interaction design, basic knowledge about codes, and more advanced graphic design skills.

In terms of other resources, there were a lot of books and websites I used to gain better understanding of the specific knowledge. I read The Elements of User Experience by Jesse James Garret, Don’t Make Me Think by Steve Krug to understand the principles of UI/UX design and how to minimize cognitive workload. I read Designing Web Application by Nathan Berry, and A Practical Guide to Designing for Web by Mark Boulton to understand the unique characteristics and common problems in designing for digital. I also checked out the works of prominent figures like Edward Tufte, and collected a lot of infographics to better familiarize myself with data visualization. More, The Interaction Design Foundation (http://www.interaction-design.org/) has a lot of free and useful interaction design books on the website, which Tomasz would assign readings from for me to discuss with him. A very basic understanding about codes also goes a long way. I found out what each code does and how front-end and back-end programming differ on the job, but there are a lot of free resources online you could use to know their capabilities and limits, namely CodeAcademy (http://www.codecademy.com/learn) and W3Schools (http://www.w3schools.com/).

Furthermore, I was lucky enough that I took a bunch of Adobe software classes before I got into university, so that I had a very good foundation with these professional standard programs.

Those computer skills hugely benefited me in my internship. My advice would be to do a lot of Illustrator and Photoshop tutorials for sure and get good with them. Also, get as much graphic design practices as you can; the practical experiences will greatly improve the efficiency and quality of your work. More, a few books on graphic design with example works can really help you communicate your ideas with people.

Finally, stay tuned into and get inspired on Dribble, Tumblr and Pinterest. These social network sites for creatives can stimulate your creativity and also keep you updated on the trend in UI/UX design. Digital design is changing all the time, and this is one of the best ways to stay on top of the trends.

5.2 What to Expect

Like most start-ups, MicroMetrics was basically a no-collar work environment with flexible schedules and workplace. Although we had our own cubicles, we could easily go into other open workspaces to do our work. Also, there were times when everyone was working overtime to meet a deadline. As an enthusiastic intern, I put in a few extra hours to meet a deadline (like the pitch deck presentation), but you are not obliged to do it unless you really want to show them your enthusiasm.

There would be a lot of communication happening, so be prepared to explain yourself on a daily basis and make other people understand what it is you are trying to get them to do. You would also need to foster trust from the very first day. Honesty is the best policy, and an open attitude and approach to deal with interpersonal relationships in workplace is essential to the functioning of the team. Also, despite it being a casual workplace, you should still aim for a detail-oriented, self-organized and self-motivated professionalism.

More on the psychological side, during my internship, I felt frustrated sometimes, and felt like I was clueless and inadequate for this position. Not saying the company did not value my input, but I was just neglecting the fact that I possess a

11

lot valuable skills and a lot of the works I did were new to me. Looking back now, I should have given myself a thumbs-up for making much progress in a short time like that. It is really important to find a balance between being demanding to your work performance and being kind to yourself.

5.3 How to Optimize the Experience

If there was one thing every intern should do before he/she gets into it, I would say it is setting goals for oneself, and not losing sight of them. It is very easy to feel lost with all the work constantly being fed to you and lose your motivations, if you do not know what you want to get out of the internship. Having goals also tracks your progress and growth in the internship and make sure you are getting what you need from the experience.

Aside from the intra-personal growth, it would also be great if you can go to conventions or events with your co-workers and form some interpersonal connections. 4 people on our team went to

UX Camp last year, and it was not only a great networking opportunity but also an inspirational experience that aided our work. When you are in those professional events and environments, talk to anyone and everyone and be friendly, whether they are on your team or not. You never know what unexpected and amazing thing cross-pollination could give you. For me personally, talking to our back-end developers was really eye-opening and interesting to me. It made me look at digital systems in a way I never thought of before.

Finally, be proactive, not reactive. Find work for yourself, and take initiatives. In a start-up company, everything is moving so fast and the team leaders are working 70+ hours at their threshold capacity. Sometimes they become very occupied and have very limited attention and time to manage you. So when no one is assigning work to you at the moment, find something to do yourself, and always think ahead. You might just hit on something they all missed.