UI Doodles

A small collection of sitemaps, wireframes, and high fidelity mockups I've created to hone my skills in user experience, visual design, prototyping, and animation.

Motor Monitor

This project was part of a two-day challenge to complete the following deliverables under the set time constraints.

Motor Monitor is a startup founded in 2016 with a goal to improve safety and awareness for their users. Because unexpected car maintenance can be a stressful experience, Motor Monitor looks to provide an easy to use, friendly, and low stress solution to keeping track with the user’s car’s health. Motor Monitor also works with auto manufacturers to better integrate their technology and is always looking to push the boundaries of tech in the auto industry. Inspired by the technological advances of of Tesla, Motor Monitor sees a bright and innovative future in the way we interact with our cars.

View Prototype

Features

• Connects through car’s WiFi and automatically updates every time user gets into car
• Alerts user via notifications if anything requires attention
• Checks oil levels, oil filter, tire pressure, and fluids
• Provides stat history and an ETA for upcoming tire pressure and fluid changes
• Map showing the nearest service centers and auto parts stores
• Share car’s diagnostics with mechanics or service centers

Users

• Owners of high end/high tech cars with advanced WiFi capabilities
• Owners of multiple vehicles to easily keep track of the maintenance health of all of cars
• Busy individuals that do not have a lot of time to be on top of car maintenance

Colors, Typography, and Iconography

These colors were chosen because of their psychological affects. The goal of Motor Monitor is to provide a low stress experience for dealing with car maintenance. Blues promotes dependability, smoothness, and calmness. Green gives off an organic, natural, and peaceful vibe. Orange promotes warmth, fun, and grabs attention.

Houschka Rounded was chosen because the letter forms provide a friendly, soft, and contemporary connotation while also being legible and readable.

The iconography strips the the visual design down to the most recognizable core elements to promote an easy to read and clean icon system.

Sitemap

Wireframes

High Fidelity Mockups

Fidelity Investments

The user experience and visual design of Fidelity's current app is a little outdated. These are some quick high fidelity mockups where I consolidate several sections into one. The trading experience was also refined to be more user friendly.

Spotify

Here I play with a new log in animation of the Spotify app.

View Animation

Stopdown Studios

A fictitious social media platform for creative individuals to showcase their work. The project started with Daily UI challenges and expanded into an application.

View Prototype