Michelle An
JC

Modura

fashion that fits your ambition

Carefully curated business apparel pieces for trendy young professionals without appearing overdressed.

Affiliation
TIMELINE
Designlab UX Academy Foundations
March 2022
Man in Floral Shirt and Linen Suit photo by Elif Dörtdoğan from Pexels | Home Line icon from Untitled UI | Heart icon from SVG Repo | Bag icon from SVG Repo | Profile Circle icon from SVG Repo
Women in Business Coats on White Background photo by Tima | Miroshnichenko from Pexels | Lemon/Milk Typeface by Marsnev 
Flip Backward icon from Untitled UI | Share icon from SVG Repo | Diverse Women in Stylish Blazers in Row photo by Monstera Production from Pexels | Row of Diverse Women in Formal Wear photo by Monstera Production from Pexels | Stylish Women in Suits in Studio photo by Monstera Production from Pexels | Confident Asian woman in Stylish Outfit with Chrysanthemum by Monstera Productions from Pexels | Star icon from Icons8 | iPhone Status Bar & iPhone Mockups by Gaurav Kumar on Figma 

A fresher take on a project that was originally submitted on March 27, 2022 for Designlab's UX Academy Foundations course (see below)

Initial Logo Sketch

Design Brief

Modura is a new eCommerce clothing brand designed for trendy men and women aged 18 to 25. These individuals are early in their careers and looking for an affordable solution for business casual clothing to wear to their jobs in urban areas.

Modura's target audience is fashion-forward and conscious of trends. They dress for the jobs they want without appearing overdressed. Develop sketches of 3-4 distinctly different logo directions for Modura.

Digitized Logo

Design Brief

Choose two concepts to digitize.


Create a “master” digital version of your logo design. Once that’s ready, create the following responsive configurations of your logo:

  • Large: This might be your logomark and wordmark together. Consider different ways they could be combined—for example, horizontally and vertically.
  • Medium: This option might use just a wordmark on its own.
  • Small: This might be a version that’s just the logomark, or, if you're using a wordmark, perhaps it’s the first letter of the wordmark.

Icon Set Design

Design Brief

Create a set of 4 or more icons for use in a future Modura app.

Home icon by Icons8 | Shopping Cart icon by Icons8 | Person icon by Icons8 | Search icon by Icons8
Home icon by Icons8 | Shopping Cart icon by Icons8 | User icon by Icons8 | Magnifying Glass icon by Icons8

Color Palette

Design Brief

Develop two color style sets for the Modura brand. In each color style set, you’ll need to choose the following:

  1. Primary palette: The most prominent color(s) that will be displayed across your website or app's screens.
  2. Secondary palette: Provides more ways to accent and distinguish your product. They should be applied sparingly to accent select parts of your UI. Secondary colors can also be referred to as the highlight, action, or accent colors.
  3. Neutral palette: Used for page backgrounds and text/body copy.

Typeface

Design Brief

Develop two different font pairing options for the Modura mobile app.

Style Tile

Design Brief

Create a style tile for Modura.

Your style tiles should include some or all of the following:

  • logo
  • brand keywords
  • color style set (including HEX or RGB codes and the purpose of each color)
  • typography (fonts, sizes, styles, and how to use each one)
  • photography style or photo treatment guidelines
  • icons and illustration style
Home icon by Icons8 | Shopping Cart icon by Icons8 | Person icon by Icons8 | Search icon by Icons8 | Top-Left Photo by Louis from Pexels | Top-Right Photo by Karolina Grabowska from Pexels | Middle-Right Photo by Uriel Mont from Pexels | Lower-Left Photo by John Diez from Pexels | Lower-Right Photo by cottonbro studio from Pexels

Mobile App Screens

Design Brief

Design three sample screens for the Modura app.

Choose any three from the following screens:

  • Sign in/Sign up
  • Home screen showing latest offers on garments
  • Screen showing details of an individual item of clothing
  • Search results page
  • Account settings screen
Screen 1: Magnifying Glass icon by Icons8 | Camera icon by Icons8 | Photo by Elif Dörtdoğan on Pexels | Search icon by Icons8 | Heart icon by Icons8 | Shopping Cart icon by Icons8 | Person icon by Icons8
Screen 2:
Photo by Sasha Kim on Pexels | Reward icon by Icons8 | Discount icon by Icons8 | Gift icon by Icons8  
Screen 3: Flip backward icon by Untitled UI | Menu icon by Untitled UI | Heart icon by Icons8 | Share icon by Icons8 | Photo by Mikhail Nilov from Pexels | Star icon by Icons8iPhone Status Bar & iPhone Mockups by Gaurav Kumar on Figma