Cardian

UI/UX Design

Cardian is a mobile app designed to help those with little knowledge about cars in the case of vehicle malfunction. This concept came about when my partner mentioned to me how it is not uncommon for people to experience car issues and then not know how to solve them. As someone with little knowledge about cars, this project not only helped strengthen my understanding of UI/UX design, but also helped me to educate myself more about the subject matter.

Goals

Brainstorm and implement the most beneficial features for the target user.
Develop an easy-to-follow user interface so in times of need, users can easily access the tools necessary.
Ensure clear communication and equal collaboration between myself and my partner are happening at all times.
Expand on current knowledge of UI/UX design.

Defining Product AI

The purpose of this chart is to break down the potential relationship between the user and the AI within the app.

Questionnaire

One of the first steps of the project was the development of a questionnaire. We created and conducted a form with a few questions in order to better understand our target audience and their pain points when faced with car troubles. A few of the questions included asking participants their knowledge level of vehicles, what they did when faced with a problem they weren't sure how to solve, and who they contacted when seeking help.

Empathy Map

Through creating an empathy map, we were able to represent the emotions a user would likely experience before using our app.

Personas

The following personas were created to help us represent and identify exactly who our app would be created for.

Site Map

Site mapping allowed us to begin to envision structure and flow to our app before actually beginning the design process.

Wireframe

We constructed low/mid-fidelity wireframes to help us visualize the app's structure, button functions, and appearance. Overall, the final product did not stray too much from the initial digital sketches.

Logo

The goal for the logo was to develop something sleek and simple to reflect the chosen typeface and the potential style of the app interface. The C shape was chosen to mimic a tire in motion as well as a representation
of the app's name.

Color Palette

The color palette was assembled with an array of vibrant and lively gradients. These gradients were established to deliver a warm, inviting, and modern look to the app's interface.

Typography

Corn Demo was selected as the main typeface. This font can be seen in the logo and is also used for page headers within the app. Hero New is the secondary font and is used for the body text throughout the app, while Helvetica Light Oblique is the tertiary font and is used much less frequently than the other fonts.

Onboarding

The purpose of onboarding is to introduce the user to the app. Onboarding typically explains the functions or purposes of an app and also is a user's first impression of an app. The following screens would appear during a user's first time opening the Cardian app.