Going from idea to rich UX prototype in automotive

Andrii Tonkonogov
Alex Debkaliuk
Valeria Zahalets

by Andrii Tonkonogov, Alex Debkaliuk, Valeria Zahalets

UX prototyping in automotive R1hbapm

Introduction

Companies in the automotive, transportation, and mobility space are increasingly challenged to innovate and define bold visions of the future. This is crucial if they want to stay competitive and get ahead of the market.

One way to go from an idea to a compelling, tangible HMI concept is to apply the traditional design methods of ideation and prototyping.

The automotive space, in particular, is challenging. Despite recent and upcoming innovations, it is highly regulated, manufacturing-constrained and marketing-driven.

Constraints and challenges are the best ingredients for breeding innovation, though, so let’s unpack a typical example of going from an idea to a compelling design prototype. Fast.

Introduction

Preparation

Working in client services, we always try to keep the customer as immersed in the process as possible. So the first step for us would be planning and prepping for a kick-off workshop.

Here are a few quick preparation tips for running a successful design workshop:

  • Goals and participants. Learn more about your participants and their business in advance. Which job functions will be represented? Find out more about the organization’s culture, behavior, processes, and knowledge sharing practices. This will not only make it easier to plan the workshop; these insights can also prove relevant throughout the project, helping make sure the end solution will fit. Make sure to let the client’s team know what they should prepare and bring into the workshop as well.
  • User and market research. Research allows you to supercharge new ideas, think in advance about the more challenging parts of the project, get up to speed on new trends in the industry, and prepare yourself for in-depth discussions during the workshop. Consider putting together an easy-to-digest practical trend report. Get the technical team involved too and identify in advance what can be relevant for your customer and the future of the project. Try immersing yourself into users’ lives to understand the people you’re designing for and what’s important to them through ethnography and early casual interviews.
  • Deck of topic cards. For some workshops, it makes sense to put a collection of key themes, topics, directions ideas, patterns etc. together as a custom deck of cards. Having a bunch of these will help you to think about the user or project in different ways. For "A day in the life of a commuter", you may want to create a collection of daily events and prioritize/discuss those. Other good candidates for creating a deck of cards could be: lists of technologies, stylistic directions for how the experience might feel, AI assistant features, etc.

Kick-off workshop

During the actual workshop, you should plan for activities that will help you learn more about the team members’ actual goals, motivations, and challenges.

Activities can help you in a couple of ways. First, you’ll learn more about and align fast on project details, background, history, and current progress, if any. Second, you’ll also get a better feel for how bold the ideas should be, and which of the many possible directions should be explored. How can you make sure you can keep the discussion going and actually tease out actionable outcomes? Check out our list of best-practice workshop techniques.

Post-workshop

Once the workshop is over, you’ll have some work to do. Even if you return from the workshop with feasible, tangible results, you will still need to give them a bit more depth before you progress to the prototyping phase. You should also use this time to set up your team, tune cross-team collaboration, prepare your testing workspace, and progress to the project start. Here are some tips for flushing out the use cases and design validation.

automotive prototyping

Allies 

When you are working on an automotive future concept, it is hard to guess technical or ergonomic limitations on your own. To work correctly with all technical or conceptual limitations, you need information. And to get information, you need allies. Who should these allies be? We’ve drawn up a list of ideas in our best-practice document. The symbiosis of your design ideas and your allies’ feedback should guarantee a good finished product.

Prototyping

The detailed design process and tools will vary based on the design team involved. But the core deliverables typically stay the same. 

  • The first stage starts with the wireframe designing & continues with wireframe prototype validation.
  • Stage two involves creating a mood board and determining the visual direction.
  • The third stage is creating the design concept and designing the whole user flow.
  • And the last stage is user testing validation and design finalization. 
vehicle prototyping design

Now let's pinpoint the design tools. Design tools should be determined from the standpoint of what the client expects from you at the end of the project and how you will test your decision with users. The basic design tools (Sketch, Figma, Invision, etc.) will work well if you want to move fast and test for things like aesthetics, clear legibility, and information presentation, etc. If you expect deeper testing sessions (e.g., if you want to display the product on the car HMI, test navigation, and dynamic things like notifications, joysticks, and steering wheel controls interaction), it is better to use Axure or bring in the engineering team to quickly build a highly realistic, interactive prototype.

For the animation tool, we use After Effects to show how the story unfolds, how the interface dynamically adapts to the driver's actions, and how external factors impact the digital experience.

User testing

This part of the project is sometimes overlooked. However, testing with real users can play a significant role in validating and justifying your design decisions, so we always strive to include it. It is scalable, so running a small-scale user testing phase will still yield great results. To ensure your user testing yields helpful results, see our list of best-practice tips for user testing.

User testing

Key factors to consider in automotive design

When designing future automotive experiences, we frequently go back to the basic challenges of drivers’ day-to-day lives. 

Try to think about all the steps in the user journey (before entering the vehicle, during, and after the trip), not just the in-car design experience. There are usually a lot of variables to account for: the number of people in the vehicle and their relationships, trip goals, car parameters, status, class, connectivity, etc. With these endless variations, telling stories can be a way to communicate new ideas and introduce new technologies with safety regulations in mind.

The final future vision prototype is the result of a dynamic and collaborative process. All the stakeholders are aligned, winning ideas are presented in the best light and everything is ready for the final demo, top management review, industry event or further technical validation. The key is to progress with frequent reviews and iteration to reduce the number of edits needed at the most costly final phase of advanced prototyping.

The final demo presentation should feel like a real-life situation. For example, try to show the design cluster in an actual vehicle. Alternatively, consider a video that looks like a promotional ad for a new car HMI.

By thinking freely at the beginning of the ideation process and discarding constraints, teams can come up with unconventional solutions. Choosing the best ideas, prototyping, and iterating are the essential steps towards creating exciting futures.

Share

UX prototyping in automotive Ralkbapm
Andrii Tonkonogov
UX Designer at Star

Andrii has been working as a UX Designer for the last 8+ years taking the lead in different projects in automotive, SAAS/CRM, fintech and healthcare. His main area of expertise is projects with a complex UX structure and a large number of interactions and complicated functionality. Andrii successfully leads the communication and product design-developing process with developers in-house and with multi-cultural remote teams.

UX prototyping in automotive Rapkbapm
Alex Debkaliuk
Head of Design, Ukraine at Star

Alex applies his 15+ years of UX Design experience to help teams conceptualize and build great products for household name brands, enterprises, and startups around the world. Using design methodologies and cross-domain expertise, he facilitates digital transformation and innovation, bridging communication gaps, challenging what’s possible and defining what’s next.

UX prototyping in automotive Ratkbapm
Valeria Zahalets
UX Designer at Star

Valeria Zahalets is UX Designer with 3+ years of experience in a range of industries. She is helping businesses make a major impact worldwide and bringing the most value to users by applying design and usability principles to shape ideas into marketable products.

Create pioneering Automotive & Mobility experiences

We help companies ideate, build, launch and scale disruptive automotive and mobility solutions through user-centered design, embedded engineering and omnichannel experiences.

Explore our expertise
Loading...
North America, Big

We are truly global.
Explore our locations around the world.

North America, Big

Star is a global technology consulting firm that seamlessly integrates strategy, design and engineering as an end-to-end partner on its clients’ digital journeys. Star’s unique approach helps rapidly expanding startups and established enterprises reach their endgames while prioritizing empathy for the end-users, society, and the planet.

Insights & inspiration

Receive the latest Star insights on trends, technologies and endgame-driven approaches straight to your inbox.

Contacts

Or write us at hello@star.global

© Copyright Star 2024. All rights reserved Privacy Policy

plus iconminus iconarrow icon pointing rightarrow icon pointing rightarrow icon pointing downarrow icon pointing leftarrow icon pointing toparrow icon pointing top rightPlay iconarrow pointing right in a circleDownload iconResume iconCross iconActive Badge iconInactive Badge iconFocused Badge iconDropdown Arrow iconQuestion Mark iconFacebook logoLinkedin logoLinkedIn logoFacebook logoTwitter logoInstagram logo