Building a flashcard app - Memo Mind

Building a flashcard app - Memo Mind

web-based flashcards for easy learning

In mid April 2023, I started on this journey of building my own product.

This was part of season 3 of nights & weekends by buildspace. A place to work on your ideas alongside other builders.

Introduction

Meet Memo Mind, a web-based tool to help learn and organize information with flashcards.

This article will share some thoughts and lessons learned during this 6-week journey.

Let's get started.


Idea and version one (w1)

During the first week, an idea was finalized, and pushed the first version off the local host.

North Star Goal - learners can create own digital flash cards on any subject they are learning & get quizzed

I was solving a problem I had. I wanted a place to organize everything I was learning in one place, notes are too information dense.

But with flashcards, there is less clutter, and can get a bird eye view easily while testing how much information is retained.

Image

Tech stack

My backend and database knowledge is limited so I decided to go with Supabase, which is an awesome backend-as-a-service that helped me get started with a Postgres database for the project.

As for the front end, I am building with Nuxt 3 and TailwindCSS. It was easy to get started and move fast with this stack.

I was able to build a magic link authentication with the code provided by Supabase within minutes and get a functioning web app. Mind. Blown.

This was me sharing the first version of memo mind in a loom recording as part of the weekly update.

A screenshot of loom recording, where I show the first version of memo mind.

It was just the bare minimal functions, but the goal was to get something published.

Thankfully, pushing this to production was super easy with Vercel hooked to my GitHub.

Shift in mental model

During week one, got to learn the concept of 'anti-goal' and what winning looks like.

It was easy to constantly feel overwhelmed by the tasks ahead. The idea of next-hour plan was helpful to get things moving and make small incremental steps.

Something I needed to work on (and still do) is learning how to talk to users. Making a note to myself to read 'The Mom Test' later.

Good Practices and general rules

To make good flashcards I came up with these rules:

  1. Make flash cards in your own words

  2. add images to the cards: people remember pictures better (Picture superiority effect)

  3. Mnemonic devices help create mental association between two pieces of information

  4. Each card will have only 1 question or fact - avoid the illusion of competence by being able to differentiate between recall and recognition

  5. Break complex concepts into multiple simple questions

Inspired by: https://www.youtube.com/watch?v=mzCEJVtED0U

Getting Users (w2)

The task of week 2 was to get people to use the app with a goal of 10 users while making improvements to the product.

I tried to improve the user experience with a new view of all cards and better card creation/editing flow. Users by default see all cards and can go into a 'focus' mode for one card per view.

The previous week was focused on building, in the second week, the focus was launching and getting people to use it.

Launching

What makes a good or bad launch?

Good launch

  • Concise, well-written, and clearly communicated.

  • Simple headline

  • Short body - what is this about?

  • Call to action message

Bad launch

  • The video is not great

  • Long and too much information for less value

  • Background noise

launching is about showing people your work and getting people to care about it

Here is me trying to publicly launch the app on Twitter.

Defining user & audience

There are many ways to define a user. One of the simple definitions is to consider the key action of the product, those who take action are the users.

An action can be further divided into two groups, a money action (pre-order, sign up to trial) or interaction-based action (used app).

I decided to go with interaction-based action.

It was important to distinguish between the audience (have interest) and users (complete a key action) and define them separately.

Audience - people who are making study notes

User - sign up & create a set of flashcards

Setting targets

My goal was to get 400 people to use the app by the end of the 6 weeks.

"by may 20, i will get 400 people to sign up and the app"

I got 11 people to sign up in the first week. This was the way to decide whether the game is being lost or won. Setting a target is important and building in public is even more.

Feedback by users

I started getting some feedback by users and worked on improving or fixing issues in week 3.

Some top feedbacks collected were social login, not working on mobile & dark mode.

Additionally, there were some feature requests and ideas suggested by some people too. I was managing all this on this google sheet.

Spoiler alert - I did not reach my target.

By the end of week 2, I had a way to measure and learn. Thus, completing the build cycle:

build -> launch -> measure -> learn

Fixing issues & launching again (w3)

I gotta be honest, I was overwhelmed or rather feeling really drained at this point. It was pushing my limits to keep up with the program and I was not doing good.

Instead of working on new ideas, I tried to fix the issues and bugs.

This was the weekend update on Twitter:

Branding & marketing (w4)

Memo Mind got a logo and a separate social media account. Week 4, was another round of building with a focus on marketing.

The home page which only had a login screen, got some new content with a header.

I wanted users to experience how the card works before sign/up login, hence, included a few cards as part of the hero section.

It was difficult to measure without proper analytics, so I decided to start with vercel's analytics which was easy to start and provided some basic usage information.

Here is the week 4 update; things slowed down but it was starting to look alright with twitter authentication and support for mobile.

Final week before demo (w5)

Gained some momentum with few more users coming in after launching on LinkedIn and getting some insight on users.

Some key takeaways from the past week

  • Focus marketing more on LinkedIn, noticing better engagement

  • Need to help users get started using the app with better onboarding

  • Thought: maybe its time for notion integration or xls import feature to mass-create decks?

Demo week (w6)

With limited time and resources, I could not finish all the things I wanted before demo day but managed to change the theme of the app to dark mode.

During this last week, I created a video documenting the journey of building this product.


Conclusion

At the time of this writing, I had finished taking a break and wanted to look back and reflect on this journey. This blog post is a way to document all of these in one place.

Now, back to building.

Did you find this article valuable?

Support Raif Shareef by becoming a sponsor. Any amount is appreciated!