Modeling exercise for 7 apps.
Tags: elm
Published: 2019-05-24 16:27:09

---
title: Modeling exercise for 7 apps.
published: true
description: 
tags: elm
---

I came up with the idea that I can train my modeling skills just by modeling apps first. Sort of a form of an intensive deliberate practice.

Let's get to it:

### TH app

- Goal:
	- Train the ability to recognize if the word has voiced or voiceless TH sound.

#### MVP:
    - Show one word out of a list of words iteratively.
    - Ability to answer with key events. Left means voiceless, right means voiced.

#### Full Blown App:
    - Show a list or results at the end.
    - Randomize the list of words.
    - The ability to get the words from a text from a website

#### Model for MVP:

```
-- Model


type TH
    = Soft
    | Hard


type Correctness
    = Correct
    | Incorrect


type alias Model =
    { words : List String
    , answer : Maybe TH
    , correctness : Maybe Correctness
    }

```

#### Full Blown Model:

To make it to the end I need to add the state of two pages Playing and Results. I also want to keep the results and show a table with them.

```
-- Model


type TH
    = Soft
    | Hard


type Correctness
    = Correct
    | Incorrect

type State
    = Playing
    | Results

type alias Result =
    ( TH, Correctness )


type alias Model =
    { words : List String
    , answer : Maybe TH
    , correctness : Maybe Correctness
    , state : State
    , results : List Result
    }
```
### Breathing app.
- Goal:
	- I have a long list of different breathing exercises.
	- They work best if you do them one after another.
	- The problem the instructions are in Russion, so I need to translate it first. I'll put in on gist later. I think I maybe even have the translation somewhere already.
      
#### MVP:  Box breathing. [This is going to be the mvp version. This app is great. Take a peak at it.](https://play.google.com/store/apps/details?id=pl.orbitemobile.breathair&hl=en&showAllReviews=true)

#### Model:

```
-- Model

type State
    = TimingState
    | BreathingState
    | TheEndState

type alias Model =
    { inhale : Inhale
    , inhalePause : InhalePause
    , exhale : Exhale
    , exhalePause : ExhalePause
    , duration : Duration
    , state : Timings
    }

-- There is going to be three states:
-- 1) Choosing the timings
-- 2) The actuall breathing
--    - There is gotta be some pause button during that process
-- 3) The end state.

-- Four views:
-- 1) inhale    has a min 3 sec
-- 2) inhale pause
-- 3) exhale    has a min 3 sec
-- 4) exhale pause
-- 5) the overall duration. Min 2 min - max 60 min.

-- All of the fields can have different time length.

-- each of the above has a length in seconds
-- a checkbox for making the thing move synchroniously.
```
  
### Note app. More on that app [here](https://dev.to/antonrich/note-app-practice-with-elm-some-struggles-as-well-1g8p)
- Goal:
	- To experiment with taking notes.
      
#### MVP:
 - Two columns. The first one has an input filed the other shows the output.
  
### Whack-a-mole game.
 - Goal:
	- Clone a [whack-a-mole game](https://www.youtube.com/watch?v=toNFfAaWghU) from  Wes Bos's js 30 course.
      
#### MVP:
- The game itself.

#### Model
```
-- Model

type alias Model =
    { holes : List Hole
    , random : Int -- for randomization.
    , points : Int -- for keeping score
    , numberOfAttempts : Int -- If the player is fast will he have more attemps.
    }

-- What will the duration be based on?
-- I think it should be based on time.
-- a fast player will have more attempts.

-- What about levels? For now I will ignore that aspect.

type Hole
    = Empty
    | Full -- the mole is in the hole
```
At first the model looked simple after I gave more thought to it I came up with this model. 

### Clock

- Goal:
	- [Clone a clock from Wes Bos's js 30 course](https://www.youtube.com/watch?v=xu87YWbr4X0)

#### MVP:
	- A cloock with a seconds hand.

#### Finished version:
	- The clock itself with hours, minutes and seconds hands.

#### Model:
```
-- Model

type alias Model =
    { seconds : Seconds } -- the rest will be similar with just different timings

type alias Seconds =
    { seconds : Time.Posix
    , svgPosition : { x, y } -- x the center of the circle, and y will be the end
                             -- of the hand and will tell the angle.
    }
```

  
### Arabic English chatroom
- Goal:
	- A chatroom where messages are transformed into Arabic English. Arabic has vowel sounds, but actualy doesn't have vowel letters. Would you be able to read English without vowel letters?

#### MVP:
	- A chat window where you can communicate back and forth. The output is processed with an Arabic English algorithm.

#### Model:
I don't know how to model this app yet, because there's gotta be a backend to this app. When I figured what that backend would be I will model the app.
  
### Penguin maze game.
- Goal:
	- Clone Lumosity's Penguin Pursuit game. Really fun game. Play this a lot on my phone.
      
#### MVP:
- A maze and a penguin that can walk through the maze.

#### Full app:
- A rotating maze
- AI pengiun that competes with you
- Levels

#### Model:

To be honest this is out of my ability that I don't even know how to approach this.
Nevertheless, I'll try:

```
-- Model

type alias Model =
    { maze : Maze
    , entryPoint : EntryPoint -- penguin's start position
    , fishPoint : FishPonit -- The end point point. Where the penguin finally get's the fish.
    , penguin : Penguin
    }

type alias Penguin =
    { x : Int
    , y : Int
    }
```
This model is just me shooting in the dark. I have some resources to follow on how to build mazes. So after learning those I will change the model accordingly.

That's it folks. What do you think of this kind of exercise? Do you think this is a good delibarate practice?