CX Designer | Creative Director
Overview
I joined a design challenge with fellow designers. We all picked different project and my chosen one was "Controlling a hyperloop sled."
In just eight hours, I envisioned a user interface that aimed to simplify the complex task of managing this high-speed transportation system. It was a fast-paced, creative endeavor that sparked some exciting design ideas.
Hyperloop Concept
Project duration: 8 hours
My roles & responsibilities: In this project, I worked independently, handling the research phase, sketching, and design concept.
My Deliverables: Persona, sketches, GUI samples ​
Tools used: Photoshop
Project
Understand
The Context
Year 2030. Cities have begun building infrastructure for a 3D transportation grid. I’ve been hired to create the in-vehicle UI/UX for an hyperloop sled.
The Objective
Design 3-states of this concept UI
1. Launch: After inputting the destination, confirm and launch the sled
2. Speed Selector​: Ability to change speed and show how cost, ETA, and carbon footprint changes
3. System Intervention​: Make it clear to the user that they are no longer in control, and provide an explanation
The Problem
This vehicle carries 1-4 passengers, but allows the passengers to control their speed of travel via a small embedded touchscreen. The system can override user preferences to speed up or slow down the sleds. Faster travel expends more energy, and thus increases the cost of the ride.
Define
Who?
Daniel
Age: 40
Work: Data Analyst
Family: Married
Location: Los Angeles, CA
Technology Exp: Tech Savvy
"I want to be able to get my whole family safely and in a timely manner to the destination of our choice."
Challenges
• Doesn’t have much personal time
• Always looks for ways to entertain his kids while driving
• Would like to use auto-pay feature to save time on transactions
Goals + Motivations
• Wants to optimise communiting time
• Always looks for ways to entertain his kids while driving
• Would like to pay for services electronically and seamlessly whenever possible
How?
Users would scan their phone or membership card to unlock the ride. The ride would then welcome the user with their name and load the user’s information.
User’s Information loaded on scan
• Recent rides
• Favorites/Work/Home/Recent addresses
• Payments history and information
• Mood preferences with light, colors and music which would be pre-recorded in the app and would load on scan
• Co-riders list
Create
Ideation
• Enable the UI to be easily accessible from both the driver and passenger seats (centered UI)
• Implement a sliding menu that includes the user's settings, destination, and time
• Switch between dark and light UI themes based on outdoor lighting conditions
• Main features to be added: carbon footprint, speed, cost, optimal range (Cost/CO2)
Prototype
Launch
Once a user has input their intended destination, give the user a way to confirm their trip preferences and launch the sled.
Speed Selector
Once the trip is underway, give the user a way to change their desired speed within a min/max range, and dynamically show how cost, ETA, and carbon footprint changes as they make adjustments.
System Intervention
If the system must intervene to either accelerate or decelerate the sled, make it clear to the user that they are no longer in control, and provide an explanation for the system intervention.
Other Steps
Testing Wireframes
Before finalizing the design, I would perform usability studies on the wireframes and the entire user flow. By involving users in this preliminary phase, we can gather invaluable feedback. That informs and refines the design's overall usability.
Iterations
Wireframe testing would allow for the iterative process not only to identifies potential pain points and usability issues but also to ensure that the final product aligns more closely with user expectations, ultimately leading to a more satisfying and effective user experience.
Implementation
Upon finalizing the user flow and achieving the desired aesthetic for our UI, I would work on creating a meticulous design system. This comprehensive framework serves as the cornerstone for presenting the UI to our development teams, ensuring unwavering consistency and uniformity throughout the application. By encapsulating design elements, guidelines, and components within this unified system, we not only streamline the development process but also uphold a harmonious and refined user interface, thereby delivering a seamless and visually appealing experience to users across the application.
Graphical QA
Upon the completion of UI implementation, a critical step in my process involves conducting a meticulous graphical quality assurance (QA) assessment. This rigorous evaluation is essential to guarantee the precise execution of the design upon delivery. By scrutinizing every detail and comparing it against the established design standards, we ensure that the final product aligns perfectly with the intended visual aesthetics and user experience, thereby delivering a polished and error-free UI to our users.
Data Analysis
After the product has been delivered to users, I would closely analyze user data and gather feedback to shape the product's evolution and refine future feature enhancements for our roadmap. This data-driven approach not only helps us understand user needs and preferences but also ensures that our product remains adaptive and responsive to changing demands, ultimately enhancing the overall user experience and driving continuous innovation.