UI Case Study | Terra Mars

Overview

Introduction

Research

Persona

20 Second Gut Test

Gut Test

The Design Process: Two Style Directions

Organic Style Direction

Organic Mood board
Organic Sample Hero Banner
Organic Sample Style Tile

Futuristic Style Direction

Futuristic Mood board
Futuristic Sample Hero Banner
Futuristic Sample Style Tile

Style Direction Decision: Futuristic

Visual Language

Style Tile and Brand Guideline

Style Guide

Logo Design

Sketches
Digitizing logos

Final Logo

Final Logo

Prototype

Desktop Prototype

Mobile Prototype

Conclusion

  • Section anchor at the top of pages to reduce amount of scrolling
  • More illustrations and animations

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store