G-dragon
_edited.png)
G-DRAGON
G-dragon is a fictional electric flying vehicle that will solve all problems with traffic jams in cities, emissions from old petrol and diesel cars.
.png)
concept
Project overview
Solo: Me
Duration: 7 days
Date: April 2021
The brief
G-dragon is a fictional electric flying vehicle that is suitable for everyone, including teenagers from 14 years. The task is to design prototypes that explore different aspects of the vehicle, as well as to evaluate users' attitudes / emotional responses towards the vehicle.
I chose to explore, and design the dashboard, and create a parenting app that is connected to the vehicle. With the help of the app, parents can set different boundaries that are suitable for their child, such as speed, altitude, and areas they are allowed to fly.
Tools
iMovie
Miro
Illustrator
Photoshop
Figma
Discover
Learn
Research
Goal
I started by researching to understand what functions a dashboard needs and investigate functions parents may need in the app. I researched everything from a flight simulator to video games to find familiar and simple features that users need.
Flying on your own is a new dimension, which means that you have to use functions that are not familiar. Thoughts that I had:
What features do you need when flying?
How do I design so that users understand all the features?
MECHANICS, DYNAMICS & AESTETHICS
MDA framework
Goal
One of the goals of the task was to examine users' feelings towards the products. Therefore, I started by first thinking about what feelings I wanted to convey.
The dashboard
Negative emotions that can occur when flying: Fear, Insecurity, Stress
Therefore, it became important to focus a lot on: Safety, Control
It has to feel safe to fly with the dashboard.
The parent app
Negative emotions that can arise in the interaction with an app: Stress, Frustration
Therefore it is important to make the app: Clear, Useful
How do I reach my goal?
I started by determining the primary functions and objects. -my focus was on creating something safe that provides a good user experience and of course using features that are as familiar as possible.
Dashboard
InsPiration
Moodboard
Before I started drawing the dashboard, I wanted to find a theme to work with. Since the product is fictional and futuristic, it felt appropriate that the theme should be Cyberpunk; a style I love. I was inspired by the 80's Cyberpunk vintage and made it more modern with minimalist elements.
Low-fidelity sketches
Low fidelity prototypes
The shape of the dashboard had been chosen by the teacher and it was a triangular shape with round corners. Here's how I started designing the instrument panel:
Responsive design
Top
I placed the GPS screen at the top so that the driver can quickly look down at the dashboard on the go.
Bottom
I adapted to the round corners of the triangle by designing round elements. All warning elements were carefully grouped together as it needs to be logical and familiar.
With the mood board complete, I quickly sketched out a variety of ideas for different scenarios in the flow using the Crazy 8s method.
This rapid way of divergent ideation is helpful to experiment with different solutions before any ideas are taken too far down the line of development.
I then dot voted the best screens to choose which would be used to move forward in the design.
Does it work?
User test 1
.jpg)
.jpg)
.jpg)
.jpg)
I tested my low-fi prototypes. It was a Think-aloud test, with questions during the test followed by an interview at the end. The 3 respondents had to select 5 emotional words that described the product. This method is called Microsoft Product Reaction Cards.
I played audio files of directions and instructions to make it as realistic as possible. The test was performed digitally through Google-meet due to the covid-19 pandemic.
Here I got the chance to test the user experience from takeoff to landing with different scenarios that may arise, such as an emergency.
I wanted to find out:
If the respondents understood ALL elements of the dashboard.
If they understand how to act in different scenarios that may arise along the way.
If they understood the instructions and the audible feedback from the GPS.
What feelings they have for the product
Keyfindings
Negative
Technologically sterile
Overwhelming elements & colours
Impersonal
Positive
Easy to use
Reliable
Helpful
My challange
Make the dashboard personal, flexible and make the elements of the dashboard feel less overwhelming.
The respondents felt that the dashboard felt safe and that was my biggest requirement.
They understood all the elements and the test was very rewarding where I got a lot of information.
Technologically sterile = personalize the screen - Make the screen adjustable in three different positions. It will also release the feeling of being overwhelmed.
Personalize it with a “Welcome Name” for example, a personal login.
How?
Finals
High fidelity prototype
Log in
Quick and easy login using a fingerprint or voice search.
Personal settings.
Possibility to call and use a contact list.
Switch off / turn on GPS or delete predetermined routes.
GPS screens
3 different screen modes (full screen, windowed and minimized).
Night and day mode.
GPS with countdown.
Turn on / off voice instructions from the GPS.
The Respondents thought that my low-fi prototype was impersonal and overwhelming. I then redesigned the screens and made them adjustable where you can choose different screen modes.
A minimized window will develop into a full screen when warnings occur. For example, when an object approaches the vehicle.
My challenge has been to place all the elements in the right place. Elements must be grouped correctly.
.png)
Full screen mode
.png)
Windowed mode
Minimized mode
Prohibited area
Warning
Parenting app
Mobile VS Tablet
Examination - Straw poll
I started by designing the app for a tablet but became unsure if I had chosen the right interface. Is the mobile perhaps more suitable? Because I was unsure of my choice, I interrupted the sketching process and chose to investigate which interface was most appropriate. The survey consisted of a Straw poll, which I sent out to friends and acquaintances.
25 people participated in the voting and the majority voted on mobile.
Doing an examination with the help of a straw poll is a cheap and effective way to save time.
Low & MiD FIDELITY
Wireframe sketches
Low fidelity
Mid fidelity
Does it work?
User test 2
I tested my low and mid-fi prototypes. It was a Think-aloud test, with questions during the test followed by an interview at the end. The 3 respondents had to select 3 emotional words that described the product. This method is called Microsoft Product Reaction Cards.
I wanted to test:
If the navigation was easy to understand and predictable.
The user experience.
The usability. Was it difficult or unclear to use?
Keyfindings
Negative
Some titles were difficult to understand
Positive
Easy to use
Clear
Interactive
My challange
Use clearer titles.
All 3 respondents felt that the app was easy to use, and no one wanted to add/remove anything in the app. There were also no oddities in the navigation.
I asked for suggested names for all the titles towards the end of the test.
They gave good name suggestions, which I used for the Hi-fi prototypes.
How?
Finals
High fidelity prototype
Log in
Quick and easy registration/login.
Register fingerprints.
Vehicle information
See the vehicle status.
Close/open the vehicle with the app.
Add/remove vehicles.
Add a restricted account
Determine the speed, ground level, allowed areas and time that the vehicle is allowed to fly.
Search
Search for trips.
Save your trips.
Send your trip to the GPS in the dashboard.
Hamburger menu
View your saved trips.
Set personal settings.
For help, reach support.
05:31 min
Product demo
What is next?
Conclusions
Future
Learnings
Because the G-dragon is a fictional vehicle, it is difficult to apply this in today's vehicles. However, the dashboard fits into a user interface for games, and in this way, I would test the user experience.
1.MDA supports a formal, iterative approach to design and tuning. It allows me to reason explicitly about particular design goals, and to anticipate how changes will impact each aspect of the framework and the resulting
designs/implementations.
In addition, it allows me to control for undesired outcomes, and tune for desired behavior.
2.Straw poll is a cheap and effective way to save time.
3.Using audio recordings and images in the digital usability test was necessary to create as realistic scenarios as possible.
