37 App – A mobile app development story – Part 1

I want to increase my vocabulary, there’s an app for that, right?

Well, there are several, but none did what I wanted. My Spanish teacher back in college told us once that you need to hear a word 37 times before you remember it. No idea if it’s true or not, but it stuck with me. So I searched for an app that would provide me with multisyllabic words and also promote repetition, and found none. So, here I am, building my own.

Part 1: Prototyping

I’m thinking a one page app with a very simple interface. Word displayed in large font with the definition below. A counter above the word to keep track of usage. And below the definition, a scrollable list of use cases. A couple of hours later, here’s the resulting prototype:

I’m also thinking about having a progress circle around the number.

Use cases:

  1. User opens the app for the first time, they see a random word from the database (to be created later).
  2. User has the option to tap the arrows and see the next/previous word
  3. The number above the word represents how many times the user has said to have used the word. Tapping the number/button increases the usage counter. Starts at zero. When usage reaches 37, the word is considered learned and is removed from the list (marked completed in the database).
  4. Tapping the menu item allows user to log in/log out, see information about the app, see a list of completed words, and other settings I will think of along the way.

Prototyping tools:

I used JustInMind to create the above prototype. It has a free tier, which is fantastic, and it’s not just a trial, it’s actually free forever, with some limitations. It has a lot of pre-configured screens and icons you can just drag and drop. And it’s pretty straightforward to use. One major negative is that it cannot handle high resolution screens. I’m on a Surface Pro 4 running at 2736 x 1824 and I had to have the Windows magnifier on 200% the entire time I used the app.

For the colors, I used Paletton to come up with colors that work together well. For someone as artistically challenged as I am, this is one useful tool. Here’s the link to the actual color scheme I used for the prototype

Your turn

Got questions about the design or the tools I used? Suggestions? Leave it all in a comment below.

Posted in Programming Tagged with: , , , , , , , , ,