PlanoMerno
Role
UX/UI Designer
(interaction design, visual design)
Tools
Sketch, Zeplin, Invision
Duration
2 months | 2018
Overview
Project
Ukrainian repair construction company.
Role
UX/UI Designer
Research
Interaction design
Visual design
Team:
Designer
Project manager
Marketer
⚡️ Challenge: Create a responsive website
Key project
stages and milestones
Step 1:
-
Moodboard
-
Brand Guides
MILESTONE 1: Completed MoodBoard. Brand book and guidelines in pdf format. Presentation.
Step 2:
-
Low-fidelity wireframes
-
Content creation (Copywriting)
-
High fidelity wireframes
-
Prototyping in InVision
-
Design-concept
MILESTONE 2: Ready & Clickable Prototype.
Step 3:
-
All Pages Visual Design
-
Specs & Style Guide Creation
-
Supports Docs Creation
MILESTONE 3: Competed design templates. Specs & Docs for developers.
Step 1
Working on mood board creation and Brand Guides I took attention to business niche and customer’s business views
The colors of the service are moderately strict, clean, and simple, which is easy to read. The light orange color was chosen as an accent, which carries a positive attitude.
Typography has a mechanical skeleton, and the shapes are largely geometric. At the same time, the font has friendly and open curves. This contributes to a more natural rhythm of reading.
Step 2
At this step, I had marketing personas by which I was able to work with a site map and wireframes.
A persona is a collective image of a specific group of people. Although it is depicted as a person, a persona is an imagery individual representing a particular kind of customers. Personas allow designers to focus on a manageable and memorable cast of characters, instead of aiming at a generic ‘target audience.
After creating the site map and wireframes, I made a prototype which helped me to test the application and identify the strengths and weaknesses of the product.
Summary
Throughout my time with this project , I learned to consistently elevate the quality of my designs by soliciting feedback from peers and stakeholders through formal design reviews and presentations.
Step 3 Visual design
