When people ask me what do I do? I try to explain them in all sorts of manner to impress and be proud of something great I do. And they accept me as a photoshop designer... phew!! It is so difficult to make them understand the myriad capacity of a Designer. The Design process is crucial to be followed as each step adds quality to the final output.
Discover, Design, Develop and Deliver.
Although as the name suggests, the involvement of a UI designer is not only in the Design Stage but also expected in the Discovery Stage. Lets take a brief understanding.
Step1: Understanding
UI Designer needs to work closely with a cross-functional team that includes product development, business analysis, quality assurance and marketing teams to provide his experience in creating elegant UI.
Customer Touch Point Analysis |
Step2: Wireframing
Once the UI team receives the Product Requirement Document, they study them to make a low fidelity Wireframe(Experience in tools like Balsamiq, Axure or even a sketch on white board).Rough Sketch Wireframe |
Wireframe is the backbone of the Interface. It is important to adhere in there
- the main groups of content (what?)
- the structure of information (where?)
- a description and basic visualization of the user – interface interaction (how?)
The fastest way to get something out of our heads is to grab a pen and a sheet of paper and quickly sketch it out.
Step3: Prototyping & Designing
These wireframes are approved and detailed pixel perfect UIs and interactive Prototypes are created then. Focusing on usability the team need to leverage rapid prototypes.Here the Graphic/Web Designer(Experience with InDesign, Photoshop, Illustrator)'s role is crucial. He needs to create color palettes, set Grid Layout, choose the right typography, create detailed iconography and deliver the design with final production assets.
Wireframe to Prototype |
Many a times the Project Manager pushes to follow the Use Case. But there is a need to understand that at times part of use case may fail. A UI expert is expected to understand when to tweak the laws.
Step4: GUI documentation
The UI designer needs to make a Design Guideline / GUI document simultaneously for maintainingconsistency of design. It may contain more or less the following:
- Language /Tone Style
- Mission, vision, and value proposition
- Target audience description and persona
- Brand attributes
- spelling and punctuation, numbers, capitalization, lists
- Visual Style
- Logo: colors, minimum size, clear space
- Fonts
- Service description and tagline
- Brand vocabulary
- Web elements: color, size, style
Logo and UI Guideline |
The visual design specifications need to be documented for project managers, programmers to refer on timely basis.
Step5: Front-end Development
The UI developers (Fluent in UI modeling tools like Adobe Suite and Languages like HTML/CSS/Jquery) work with the development team to implement front-end design into actual code.Developer's job done easy |
Step6: UI Testing
UI designer also does the usability testing through direct observation and A/B testing.If you’re the stereotypical “technical” or “business” founder of a startup, partnering with a designer co-founder can give you an important advantage and help you achieve early success.
Source: designerfounders.com also designstaff