Design creation (or UI) is a critical process in the creation of an application or website. There are many steps in the creation of a project and while each step is essential to the success of a project, design is the foundation of how that project will look. The result of the design phase (or mockups) will then stand as a contract which can be referred to later to assure the final result is what was ordered.
While design tends to seem unrestrained and often seems to have no boundaries, websites do however have many boundaries. They are certainly constrained by the many different browsers, user skill level and the technologies used. The world of design and the Web must be frequently married up to assure congruence throughout. A design might look cool in a still mockup but that doesn’t mean that it can be easily converted to a functional website. This results, in the designer constantly choosing between a time-saving method as well as a cost saving one to create the best form and function possible within budget.
Planning Phase
A project starts in the discovery phase and moves into the planning phase. This is where all the critical thinking comes into place to figure out what, why, how, and where things should go/do. The planning phase can sometimes take as long as the development phase because it is so critical that all the requirements are hashed out from the beginning and things are as clear as they could be. Part of planning includes:
Documentation
As much information is gathered regarding the project to figure out the flow of the website, navigation and the functionality.
Wireframing
Wireframing is the process of creating rough sketches or layouts using the information gathered from the planning phase. Wireframes can be rough sketches or simple layouts on the computer that do not exactly represent the final look and only are used for placement. These can often be boxes or line drawings that depict the placement of things.
Design
Once the requirements have been thoroughly thought out, they must be given shape and color. The planning phase only provided a rough idea where things would go but the design phase is where things become more concrete and the look and feel of the website starts to resemble a real website without the functionality. The design phase can be divided into:
Mockups
This is where the designer reviews, requirements and wireframes start to give the project shape. Mockups are created in Photoshop and this is where a color scheme, typography and layout is chosen. The designer provides a variety of options to the client and the client will narrow down the style and look they desire. The final and approved mockups will be used as a blueprint to create the website functionality and look.
Client Review
During mockup design the client must review the mockups in detail to ensure the final approval is what the client wants. The final approval will be used as a contract along with the SRS document to create the final website.
Good planning and design will ensure the success of a project and can prevent many obstacles, glitches and drawbacks. In the end it will also mean a satisfied client and a smooth project.
