To understand the immediate context and needs of the users and their working habits, we observed operators without interrupting them, asking follow up questions. We also had TYRI telling us more about the current light industry and what the business needs are or why they are seeing potential in this solution.

Key takeaways

• Operators want to do their work efficiently and effectively. Adding a phone with a touch screen in the mix seems counterintuitive. But the flexibility and efficiency that gets introduced with an app can’t be beat. How can we ensure to enable users instead of holding them back? 
• The array of different work conditions and use cases, and that currently there are only on and off solutions on this market
• Current hardware installations are connected to inside the drivers cabin with no way of controlling it remotely
• Users lack flexibility for better fleet management and changes to groupings

IL_Users_Slider1

IL_Users_Slider2

IL_Users_Slider3

IL_Users_Slider4

After doing our research we had a better understanding of who we are designing for. So we mapped personas with their wants, motivations and stories – have a look through them! The MVP for this app focuses mainly on users 1. Bob the builder, 2. Hector Head of Construction and 3. Dave the driver.

After understanding more about the context and the user  we created a big wireframe flow with sections of the different features. We focused on efficient and quick change of brightness and temperature making the meshes control the home screen with a navigation drawer to switch meshes. 

The yellow sticky notes are questions, unknowns or ideas. The grey ones are consequences to decisions made in this flow. We printed this wireframe flow (and it’s first version) out to have it on our walls so we could constantly and easily refer to it.

I always paper sketch! Sometimes creating digitally slows me down and I get too focused on alignment. I made lots of sketches, but here is an example of the adding lights flow, taking the user through the steps of identifying and provisioning a light. I then quickly created and tested flows with a Figma Android Component library, since we were developing Android first for Resource reasons.

I planned an internal usability test at The Techno Creatives. We were short on time for the MVP but I wanted to make sure that the interaction patterns made sense to people, even if we were not testing with the real users. Our objectives was to uncover problems, test understanding of words and content, expectations and to see the app used in context with lights. The method was quantitative testing with 5 people for the owner flow, 5 people for the user flow and their background was a range of education, age and iOS/Android users. We even created a box with information that the lights and remote came in, to see if a user can completely without guidance set up and control lights. 

Key takeaways

• The word “mesh” was confusing and never got explained 
• 8/10 users did not have any relation to brightness levels 1-5, but would have preferred 0-100%
• 7/10 users thought “Remote” was referring to distance 
• 10/10 users could turn lights on/off and change temperature and brightness
• Differentiation between groups and lights was not clear enough
• iOS and Android users different set of icon usage (f.e.: share)

Testing almost to scale

We tested early and often. Of course in every project as a designer you would like to have many, many user tests. But often the budget (especially for an MVP) just does not give room for all that we want. Due to it’s many components and complicated tech, we designed and developed with the real lights and even a real Caterpillar dumptruck toy – basically the real deal. These moments don’t just give us insights on interactions but also adds the fun and excitement to this job. Personally I am a big advocate for getting out of my screen and applying real life to designs.

To create a scalable, cohesive and successful product, as well as to efficiently make design decisions I decided early on a creative direction of the UI. This involved  researching TYRIs branding, lifting up the elements already presented and enhancing them in the digital product. This includes visual elements like buttons, but also more abstract parts, like the Tone of voice. The brand personality is: Hard-working, Responsible, Intelligent, Quality focused.

Out of this creative direction I started to build and maintain a design system for the high-fidelity designs based on Android’s compose framework.The iOS app is mostly also based on Android designs, but has some special designs to accommodate different user groups between Android and iOS. 

Since the app is quite simple and minimalistic, I wanted to bring out the smart tech of the lights with clean but high-quality looking illustrations for the devices. 

To guide the user consistently we had a Confluence document with the UX writing for different cases so developers could easily copy and paste, as well as communicate to me what errors there are. It was quite a challenge how to communicate very technical errors to the users, how much to tell them or not and how they can recover.

Based on the digital brand guidelines I made I also made a UX writing guide, with tone of voice, writing standards, vocabulary and patterns. The tone of voice in this app is: 

• Supportive and instructional
• Solution-driven and straightforward
• Guiding, clear and responsive