12/08/2024
Good morning, It's Tuesday.
We can understand the framework Design Process through the analogy of a building.
project's scope defines the value proposition, the product, and the features that meet the business objectives and user needs
Strategy
Let’s say you have a piece of land and would like to construct a building. The first few decisions of the project include: Why are you constructing a building; is it to live in or for commercial purposes? Who might want to rent the building? Is the location favorable for potential buyers or renters? You consult appraisers and attorneys to help you with these decisions. Through these questions, you identify the business objectives and the user needs.
Scope
The decisions taken on the Strategy plane influence the scope. In the case of the building, you consult a professional, who inspects the land to assess what is possible to construct on it — a detached house, an apartment building, an office space, or maybe a shopping mall. The project's scope defines the value proposition, the product, and the features that meet the business objectives and user needs.
Structure
Once the scope is decided, your architect creates blueprints showing the entrance and exits to different rooms, hallways, restrooms, elevators, and staircases. This is the structure — how the user interacts with and navigates around the product’s features.
Skeleton
The architect creates sketches or 3D models based on the blueprint and includes details of the interiors. The architect also enlists the help of a builder to create a full-scale sample of a portion of the building, complete with furniture and fittings, to give you a more realistic feel of the space. Here — on the Skeleton plane — the interface of the product becomes visible.
Surface
Finally, an interior designer helps you decide the color of the walls, the flooring, the furniture and accessories in individual rooms. The Surface plane is where the layer of presentation is put in place.
The Digital “Building”
Let us apply this framework to a fictitious digital product.
The UX team first identifies the users, their challenges and how users currently solve those challenges. They conduct surveys and interviews and use tools such as user personas and customer journey maps. At the end of these activities, the team may find out, for example, that freelance writers (potential users) find it difficult to maintain books of accounts (the challenge). Perhaps existing applications do not cater to the specific nature of their services (opportunity).
UX designers often work closely with business stakeholders for these strategy-related activities and decisions.
The team brainstorms to identify potential solutions and then scopes out the value proposition. Let’s say the team decides to offer a freemium mobile application for freelance writers. They identify the different features of the application and create a product roadmap, which prioritizes the features to introduce first. The designers consult business stakeholders as well as technical teams to create the roadmap.
The team then begins work on the structure of the application. This typically includes different types of flowcharts and maps indicating how information is classified and how users navigate around the product. Let’s say the first feature to roll out is invoices. The team classifies the different pieces of data associated with invoices — date of issue, payment terms, due date, etc. There may be other pieces of data, such as customer name, contact information and payment modes. The team then identifies the relationships between these different pieces of data in a logical manner. This task is sometimes handled by specialists called information architects.
The skeleton of the application is where the first drawings are created, in the form of wireframes. Wireframes are simple line drawings, usually no more than labeled boxes and lines depicting different items on the screen. These wireframes may be turned into prototypes to get a feel of how the application works.
The surface is where all the visual design elements — colors, typography, icons and illustrations — come into the picture. This also includes the content and microcopy such as labels, headings, messages and instructions.
