Software developers are known for being good at writing code. Among themselves, juniors are also assessed heavily on this. While being good at coding takes a lot of learning and practice, it only helps developers implement the features their bosses want. To go from just implementing to actually creating a great product, we need to see how to “design a product that meets the needs of stakeholders.” This’s what I’ll talk about in this post, based on my insights as a Senior Software Engineer at Huawei. I will take this very blog website as a simple example demo.
3-Step Design Process
The flow chart above summaries the entire process of creating a product from scratch. It illustrates how a “System Of Interest” can be characterized as a collection of “Features” and “Functions,” which the implementation as a “System” must adhere to. Below I will explain it step-by-step.
Step 1: Define “Scenarios” so as to output “Features”.
Here a System-of-Interest represents “what needs to be created”. The first view to look at it should be what values this new creation can provide to its users, as well as how it affects its non-users. We name the values as “Features”, and the users and non-users together as “Stakeholders”. A systematic way to define successful features is to base it on “Scenarios”.
A scenario describes how the product will interact with the stakeholders, and a feature is successful only when it benefits the users and acceptably affect the non-users.
If the product can’t benefit the users, it will be a waste of resources to create it.
Live Example – What features should my blog website have?
My blog you are reading was created because I want to (1) share my thoughts on software with interested people, (2) make friends with aspirational architects and developers, and (3) discuss with you how to improve our skills and advance our careers together in this changing world. Both you the blog readers and I will be the users of this product.
With the above 3 scenarios in mind, I could easily solidify the key Features (values) of my website:
- Allow you the readers to access and read my posts easily.
- Allow me the blogger to easily write and spread my posts to you.
- Allow both my English-speaking and Chinese-speaking friends to read.
- Allow us to have discussion on each post.
Step 2: Define “Functions” from “Scenarios”.
After understanding how the product provides benefits in different scenarios, we can identify what “Functions” the product needs to perform in each scenario.
Functions describe what the product can do. While the Features as the first view of System-of-Interest make sure that the end users will use the product, now the Functions here as the second view of System-of-Interest make sure that the engineers will understand what needs to be created. These two views have different audiences.
Features alone only describe what the stakeholders care about. They only enable a partial understanding of what the product can do. By defining Functions which together satisfy all the target scenarios, we for the first time has a full understanding of the capability of the System-of-Interest.
Functions include two categories: “Business Functions” which provide direct values to users, and “Design-For-X Functions” which aims at improving the design and operation of the product. “X” can stand for the Reliability, Testability and many other properties.
A simple way to define a function is to express it as a “Verb-Noun” pair.
Live Example – What functions should my website provide?
To support the scenarios mentioned previously, this website needs to satisfy these business functions:
- Show contents to readers clearly, both on desktop, tablet and phone.
- Possess a friendly user-interface for formatting the blog posts.
- Support translation between English and Chinese.
- Possess comment section for each blog post.
As a blog writer who wish to take minimal effort to keep the website running, I added a Design-For-Maintainability function to my requirement.
Step 3: Implement “Functions” via “System Elements”.
With the complete set of functions defined, we can finally start designing how to implement our system. (The most exciting part for engineers!)
First we need to identify what software or hardware elements (“System Elements”) can be used to implement each function. There can be multiple options for a single function, so the complete set of functions will lead to multiple sets of element options, with each set trying to fulfill each function.
The key design task here is to form feasible combinations of these elements as candidate solutions (each combination chooses one element for each function), then assess these solutions against some criteria to pick the best one.
Coming up with a feasible combination of elements relies on the ability of designing “Architecture”. In a nut shell, the goal of architectural design is really just to connect these elements in a practical way. But this is easier said than done, because sufficient understanding on how the elements can work together are required, and this is built upon technical experience.
With the candidate solutions in front of us, we list out our assessment criteria such as (1) How well each solution satisfies the Features, and (2) costs in terms of money, labor, and time. By scoring each solution against these criteria, we can choose the one with the highest score as our final architecture.
Eventually, we further break down the architecture into its software and hardware parts, allowing the engineers to build and program the system elements and hence the overall system.
Live Example – Design the Technical Architecture of my website.
Take the underlying software of my website as an example. I could have coded it from scratch, but I chose to employ the popular web content management system “WordPress.org”. Coding it would require full-stack expertise and too much time, whereas WordPress offers numerous out-of-the-box functionalities for free. Additionally, WordPress provides friendly user-interface for front-end appearance design, back-end data management and more.
Therefore, instead of coding with some front-end and back-end frameworks, managing my own database, and designing how these elements can form an architecture, I chose the predefined architecture WordPress, which saved me time cost and satisfied my Design-For-Maintainability requirement.
Also I didn’t need to worry about the underlying hardware (web server) in this case because I chose Bluehost as my hosting provider. Again Design-For-Maintainability.
From this point forward, I began designing the layout of my website in order to implement the business functions I defined above.
Conclusion
All in all, excelling in product design involves understanding stakeholders’ needs, defining product functions, and implementing them effectively. It’s about creating solutions that solve real problems and add genuine value. I hope you have enjoyed this introduction to product design, and please let me know your thoughts in the comment section below!
