Making design beautiful
A brand and visual refresh, gives an opportuinity to revamp entire product workflows and user journey
The Strategy layer
This is the outermost layer with the inception of the idea
The team and I, would then intricately examine the idea with the user needs and/or business goals
Brand Launch
Demo video to get things going
Outward and within org communication of rebrand
Redesign of all touchpoints
Slated goal for the rebrand, I took the opportunity to relook and redesign all the screens of the workflow from UX perspective
dWeb
mWeb
App
Emailers
SEO and static
White Labels
Technical challenges
Since the technical architecture and the BE dependency was not in scope to change, I tried to push the boundaries of what all can be influenced
The Synthesis layer
This is the second layer where the idea is viewed from a design lens
I would create a design strategy here for the problem/idea exploration
The Scope layer
This is the third layer. The idea at hand is checked for feasibility from tech, content, business, and even legal.
Answering the question, 'What are the functional requirements' ?I would then tie the incremental changes, feature improvements within some MVP framework with the product managers
Prep design work for dev estimation
Before the migration begins, a two week design spike to generate design artefacts for a direct 1:1 translation
Component mapping
Create translation matrix for devs to estimate
Mapping for Typeface, colors and components
Direct 1:1 translation screens
Screens without UX changes, for direct translations of typeface and colors
Necessary design component revamps
Necessary design pattern changes, like moving all pop-ups to Bottom sheets
Consolidation of nomenclature, etc.
Active subscription cards
Sectioning the Landing Page
In order for the dozens of SEO pages to be moved to the new DS, the landing page has to be sectioned
These sections are then individually designed, and developed as plug and play components
These can then be taken over by the marketing teams to generate SEO pages as the need arises.
The Structure layer
This is the layer where the normally understood design work commences
Here I would 'Structure' the research / test & results, the information architecture, the touchpoints, etc.
The Skeleton layer
This is the layer where the information and content is arranged and presented. A common output is a set of wireframes.
It is here where a framework or a template is envisioned, also taking into consideration the UI and design system, navigation.
The Surface layer
This is the outermost layer perceivable to the audience, customers and users, basically, the final screens
I would create how should the product look and feel emphasising visual design, flow, patterns, system feedback, etc. This would be done entirely using existing or creating newer design system components
The Significance layer
Though not a part of the original classification in the book, I've added this to emphasise the need for Significance measurement in design efforts so as to assert a seat at the table
I would try, alongwith the product managers, to determine the objective functions; before and after metrics; through statistical significance, reviews and testimonials, surveys, page or purchase conversions, and even resolution of customer doubts before reaching customer care
The S layers
Thanks for reading till the end, in these attention deficit times.
The S layers that I have broken down each project into, is a my attempt to use the Elements of User Experience by Jesse James Garrett, to position my work.
These elements, often perceived as planes, travel from abstractness towards concretisation.
Basically this would be the design process followed for each initiative, either entirely or in parts.
Click to know more.