"Why? What? How?" framework
Tags: webdev, statemachines
Published: 2020-10-14 04:53:35

---
title: "Why? What? How?" framework
published: true
description: The mind framework for making your code "right"
tags: webdev, statemachines
series: Do not just code
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/bia24weur9e9u9p4jh27.jpg
---
"We cannot solve our problems with the same thinking that created them" – Albert Einstein

> This is Why→What→How, as well as Why←What←How. 
> A way you move forward, and the way you take a step back.
> You will see.


# An evil Jinn

Once upon a time I've used [a concept of an Evil Jinn](https://dev.to/thekashey/the-duck-tales-ihi), which turns your wishes against you:
- 😎: _(why)_ have no idea why, but...
- 😎: _(what)_ I want to be rich!
- 🧞‍♂️: _(how)_ There are many different ways to make your wish come true. I'll pick the most painful one.
- 🧞‍♂️: so, here you go. You are rich as Scrooge McDuck. Because __you are__ Scrooge McDuck. Well, exactly as you commanded, master. Have a good day, quack. _Quack 🤣, gosh, another looser_.
- 😎: 😟, hey! wait! I didn*x$ssshhh 💨. Quack!

This is what happens when your goal is `what` and you are not thinking about `how`. You gave too much power to the 🧞‍♂️, haven't explained constraints and the detailed requirements.

👉 Take a step back. Try to find `why` you want to be rich. 

> There is a whole film about this - [Bedazzled](https://en.wikipedia.org/wiki/Bedazzled_(2000_film))
![Bedazzled](https://res.cloudinary.com/practicaldev/image/fetch/s--S1O1YYQE--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/1pwe6mew037skc82k01k.jpg)

# Frameworks
There are many other widely known frameworks developed to help you avoid painful consequences of unwise decisions. 
- [OKR](https://en.wikipedia.org/wiki/OKR)
- [SMART](https://en.wikipedia.org/wiki/SMART_criteria) 
- and [SBI](https://www.ccl.org/articles/leading-effectively-articles/closing-the-gap-between-intent-and-impact/).
All have a purpose to help you structure something from "end to end" and "understand better".
 
For example - understand what you truly desire and what is truly required. And separate one from another.

## OKR
[Objectives and key results](https://en.wikipedia.org/wiki/OKR) is a goal-setting framework for defining and tracking objectives and their outcomes. Used to run many businesses and make planning.
> OKRs comprise an objective, clearly defined goal and 3–5 key-result specific measures used to track the achievement of that goal. The goal of OKR is to define how to achieve objectives through concrete, specific and measurable actions. The key benefits of OKRs are focus, alignment and engagement.

The biggest difference OKR and his best friend [KPI](https://en.wikipedia.org/wiki/Performance_indicator) (often used together) is the last point - focus, alignment and engagement.
`Key Performance Indicator` alone is a subject for [Goodhart's law](https://en.wikipedia.org/wiki/Goodhart%27s_law), which is derived from the [Heisenberg's Uncertainty principle](https://en.wikipedia.org/wiki/Uncertainty_principle) 
> - Any observed statistical regularity will tend to collapse once pressure is placed upon it for control purposes.

In other words - `key results` without an `objective` is a road to Hell.

OKR can be read as:
- WHAT you want to achieve. "I want to be rich!" 😎
- WHY you want it. "It will let me buy a new car!!"
- HOW to do it. Not able to give you an advice, but here is multiple steps, `key results`, which will lead you to the goal.

> and that's a very poorly designed OKR 😉

It's very important to distinguish the `goal` and the `result`. True Goal should be a `direction`, not something that you can achieve. 
👉 If you can achieve it - it is a key result. Just a step on the way to the goal.


![life is a journey not a destination](https://dev-to-uploads.s3.amazonaws.com/i/eaa4indpom4m0t9dsot1.jpg)

Life is a journey not a destination:
- Key Results are the __journey__
- Objective is the __destination__

### SMART
S.M.A.R.T. - is very alike Fallout [SPECIAL](https://en.wikipedia.org/wiki/Fallout_(video_game)#SPECIAL_system), but for project management. A _mnemonic acronym_, and a very role-playing in both cases.
SMART is a way you can describe your `objective`. The definition should be:
- Specific – target a specific area for improvement.
- Measurable – quantify or at least suggest an indicator of progress.
- Assignable – specify who will do it.
- Realistic – state what results can realistically be achieved, given available resources.
- Time-related – specify when the result(s) can be achieved.

So your objective should not be just "I want to be rich!", it should be a little SMARTer. At least more _Realistic_, and _Time-related_ - you probably want to be rich today, not 70-y years later.

🧞‍♀️ is waiting for your mistake, looking for every missed detail in your `WHAT` he could use against you.

![You can't just define an objective](https://dev-to-uploads.s3.amazonaws.com/i/mlysk865cxrno6012xxh.jpg)

Another important moment about SMART, as it pointed by authors a few times:
>  It is the __combination__ of the `objective` and its `action` plan that is really important. Therefore serious management should focus on these twins and not just the objective. _Thank you Wikipedia._

Which is again - an `objective` without `key results` is not  something good.

--- 

There are more _mnemonic acronym_ based approaches

#### SMARTer or SMARTAA
A smarter SMART with more features 
- Trackable and Agreed

#### CLEAR
Collaborative, Limited, Emotional, Appreciable, Refinable

#### SIMple goal framework
- Specific
- Important
- Measurable

#### RISK

- Requirements
- Information
- Suppositions
- Knowledge

Requirements: what is the expected result of this project

Information: is all the information clear about what I need to do and all it’s parts

Suppositions: are my assumptions true? Is there any flawed assumptions?

Knowledge: do I have the required knowledge to understand and solve the problem? Do I need to learn something new?

#### SPEAKING
Setting and Scene, Participants, Ends, Acts sequence, Key, Instrumentalities, Norms, & Genre

## SBI
The Situation-Behavior-Impact Model (SBI) was created to provide a better feedback - make it _structured_, reduce the anxiety of delivering feedback and also reduce the defensiveness of the recipient. 
The SBI feedback model is simple and direct: 
- you capture and clarify the `Situation`
- describe the specific `Behaviors` observed
- and explain the `Impact` that the person’s behavior had on you.

Like:
- `today`, `after reading this article`, `I liked it`.
- `yesterday during the meeting`, `your internet connection was unstable`, `we lost you`
- `last year`, `we had a lunch together`, `you will owe me`

Sounds too simple and almost obvious but this is the goal - provide you with a framework to make so. You don't have to think much about the SBI - just follow the pattern.

The hack is: Situation/Behavior/Impact is the same thing as Arrange/Act/Assert!
> AAA: First you set up all the data you need for your example (Arrange), then you call the method under test (Act), then you verify the output was up to your standard (Assert).

First explain all the circumstances (Situation/Arrange), then you explain what the individual did (Behavior/Act), then you explain how it ended (Impact/Assert). 
And yes, this means that the “system under test” is the individual.

SBI(as well as tests) can be viewed differently if flip it:
- I want to cause an `Impact`
- Which `behaviour` I should use
- In which `situations` it will work

Then you can work towards creating such situation. You know what you have to do.

🤔 Not much difference from OKR - moving towards some goal.

![Which way?](https://dev-to-uploads.s3.amazonaws.com/i/50d4d1fgbfayogkbg0u0.png)

---

And here we go. Let's try to derive a new system from the existing ones.

# WHY/WHAT/HOW

I did not invent WWH. It was in use by therapists, especially Psychotherapy for ages. As well as detectives, marketologs, analysts and so on used it.

To be honest I never had any therapy, but from many different films I know that their job is to explain _WHY you are you_. WHY you are doing that, not this. Their job is to find root of your behaviour and explain it to you. Hello Sigmund Freud my old friend.

But we are not here for the therapy. Right?

---

My grandfather knew what he needs, and usually was asking his grandsons to help him.
- every time he asked us to do something, my brother was doing exactly __WHAT__ he was told to do.
- and I was asking __WHY__.
- And it was way faster to do _that something_, than to explain me why it’s needed.

It's ok, and sometimes you need to do what you were told to do. But it's better to think what you are doing, how you are doing it, and why.

> - Why was the change made this way?
> - How does it help?
> - Is it working as we want?

Let's imagine you are looking at the code. You can see only `how` it was written. Then you understand `what` was made, and then you can think about `why` it was made.
You are real detective 🕵️‍♀️!

## Why

Every time I ask my kids to clean the house - am not expecting questions like 
- "WHY". To keep it clear, dummy!
- "WHAT". What?! Clean the house!
- “HOW”? "How" is ok, as long as there are many ways to keep it clean, and, ok, you can skip mopping today.


Jokes apart - __why should always come first__. After you have a reason, a target to reach - "I like the house to be tidy",- you might find a way to fulfil it, probably home chores are the solution; and then find an exact way to do it (vacuum, mopping, and so on).

Recently our kids at last got the point - we didn't ask them to do home chores (which are `how`). We wanted their rooms to be clean (which is `what`). They did not yet understand `why` we need it, but already can act more thoughtfully, keeping everything constantly tidy and not spending too much time on chores.

---

`WHY` is like - you __want__ the iPhone 12. But... why? Do you really need it?
So you will be told why you need it, and why you can't live without it any longer.
> Go To the Apple Store! Now!
> This is `how` you can get ~that~`what` thing, and click thing button to watch our `why` presentation one more time 😉

![iphone meme](https://dev-to-uploads.s3.amazonaws.com/i/cfdl90pgjmp6xcy0ow25.jpeg)

---

There is the same point, from a different perspective - from a Start With Why. Like this is “why” you are buying an iPhone every year - you believe in Apple's stories. 

![Start with Why](https://dev-to-uploads.s3.amazonaws.com/i/7a501ktaqeempfpsolze.png)


## What

What is a problem? I mean - `what` is a problem. `What` is what people tend to start from. 
- we want that no matter why
- Let's do it! I have no idea why
- I WANT TO BE RICH! 

But `why`? Is there any reason? You might want to buy a new house? Why? Might be you need more space? Why?

👉 Every time you `what` - make a step back and find your `why`. Only then make a step forward to `how`.

That’s a standard trick, especially in movies - when someone is going to do something - as them `why`.
> And then the bad guy will start a long monolog explaining his devil plans and the reasons to nuke the city. Got enough popcorn?

![Why oh Why](https://dev-to-uploads.s3.amazonaws.com/i/j4t7t6sg8v4rjang6osq.jpg)

What is always the least valuable thing. It is in between of WHY and HOW.

## How

And `how` is always different. How is the end and the beginning (remember - this is Why→What→How, as well as Why←What←How).

- TypeScript is "how". It's not going to fix anything without  a _fixable_ subject.
- GraphQL is "how". This is how you talk to server, but not "why"
- Expensive Nikon Camera is "how". You can picture the same "what" using your phone. So `why`?
- Almost any other technological solution is a senseless "how" without an `Objective` and `Reason`.

Refer back to the other models and try to understand that it is all One Question. A holistic point of view.

Note the difference:
- How are you doing
![How](https://dev-to-uploads.s3.amazonaws.com/i/pibinpyt0ewd37w7i5zp.jpg)
- What you are doing
![What](https://dev-to-uploads.s3.amazonaws.com/i/mpu0u15279zni40gg4dq.jpg)
- Why you are doing
![Why](https://dev-to-uploads.s3.amazonaws.com/i/3b0kdcc3zrhi5gqcbm04.png)

# How can this help you?

### It can help you code
Coding is `how`. Keep in mind `what` while you are doing it (and `it` is `what` as well).
Don't think much "what you are writing", think "what you are doing". That will protect you from refactoring for the sake of refactoring, hooks for hooks, speed for speed.

This is something OKR is about - to keep the right direction 
> _"It is the __combination__ of the `objective` and its `action` plan that is really important"_. 

Planning is `what`. `What` is something to do, something you are doing, or done. An `objective`.
But how to decide what to do? Find the most and least important, and even define the way to calculate the importance?

`Why` is usually a missing part. Start from it, and end on it.
---

React, Angular, Vue - they are different `how`, different `why`, but the same `what`.

`What` is something user might experience, and it does not matter `how` it is made.

However - make a step back - why you should pick one framework, but not another? It's not only about customer experience, but developer experience, and (sometime the main) business needs and requirements.

A single `what` might driven by different `why`. One `why` can create any `what`. There is an infinite number of `how` you can actually implement it.

> There is another mental concept here - [blind men and an elephant](https://en.wikipedia.org/wiki/Blind_men_and_an_elephant) - which is about a single thing(an elephant), can be described in many ways.
![blind men and an elephant](https://res.cloudinary.com/practicaldev/image/fetch/s--4gJL4jdd--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/nzv5asba07hmlwkzdiy6.jpg)

---

- You can have a problem to solve - it's `why`. __Take a step forward__ and find `what` you can do to solve it.
- You can have an idea - it is `what`. __Take a step back__ to double-check does it worth it, and __then step forward__ to find a way to make it real.
- You can just want to apply something, try a new language or framework, play around... solve something in a better way? It's `how`, and it need `what` and `why`
> except you just enjoy doing it.

Too many people are just doing. Using Redux because they were told to. Not understanding CSS or CAS theorem. Focused only on the code.

Too many people are just doing a thing. No matter how, and it ends as a technical debt nightmare. But we are building a cool this? Sure?

Too many people are after "why". They might truly believe that it's a good reason... to start a war for example. This is not `how` you should resolve problems and not `what` you have to do.

This all working only holistically.

# Technical and non-functional requirement

[Wikipedia defines](https://en.wikipedia.org/wiki/Non-functional_requirement):

Broadly, `functional requirements define what a system is supposed to do` and `non-functional requirements define how a system is supposed to be`. 
Functional requirements are usually in the form of "system shall do <requirement>", an individual action or part of the system, perhaps explicitly in the sense of a mathematical function, a __black box description__ input, output, process and control functional model or IPO Model. 
In contrast, non-functional requirements are in the form of "system shall be <requirement>", an overall property of the system as a whole or of a particular aspect and not a specific function. The system's overall properties commonly mark the difference between whether the development project has succeeded or failed.

- functional requirements is `what`
- non-functional requirements is `how`
- 👉 both are not `why`

# Conclusion

Let me be short - this is a stock photo about "talking therapy".
On the left is your spaghetti code, and on the right is Why/What/How
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/b5ftzr5lnkacyshildf7.jpg)

It's really that simple.

PS: Read [the Duck Tales](https://dev.to/thekashey/the-duck-tales-ihi) for more mental models you can apply as a software engineer.

PPS: And “Start With Why” talk - https://www.ted.com/talks/simon_sinek_how_great_leaders_inspire_action - the same idea, different order.

![Golden Circle](https://dev-to-uploads.s3.amazonaws.com/i/jm4vpgcf97rct8emei6h.png)

> 🤔 `why` did I write this post? I know `what` I wrote, and `how` I wrote it, but `why`.........