This document will help you clearly define your MVP and distill your functionality into features. These are tools to break up your app into smaller tasks—all of these can (and should!) be revised as you go.
An MVP (minimum viable product) is a product with just enough features to demonstrate the functionality of the product. For a company, an MVP’s purpose is to show enough features to satisfy initial users/stakeholders before using too much time, money, and other resources.
A feature is something an app user can do, like save personal information, take a picture, send a message, or rate something. Keep features simple and break them down into the smaller parts required. For example, allowing a user to log in requires creating a route to handle the login, a database query to confirm a user is already registered, and a session to store the user’s user ID.
A user flow diagram shows how users interact with your app. To plan what code is needed, consider what views are needed for your user. Do users start on a splash page or a login page? Should they go in a specific order? Here’s an example of what a user flow through Amazon might look like:
Wireframes are diagrams that represent simplified content on individual pages. Use wireframing to consider how your user flows would best fit into the structure of a page.
Here’s an example wireframe:
Look at your user flow and wireframes to determine what you’ll need to create, read, update, or delete from your database as you move from page to page. Consider what data you’ll have through APIs, users, page content, etc. to plan a schema for your objects. A sample simple schema could be:
Additional data model types can be found here.
Remember
Define the actions of your app that need to save or retrieve data and list the API routes for them, e.g.
Call to Action From the design, it should be obvious what you expect the user to do on each page. If you want the user to log in, click a button, watch a video, or do something else, the trigger to that action should grab the most attention on the page.
Be Consistent and Considerate Consider your audience and subject (not your own style) when making design choices. Your users will thank you for simplicity, legibility, and consistency.
Look at conventions on other sites and stick with them. For example, login links are usually in the top right corner of navbars, so that’s where your login link should be because that’s where your users will expect it. Responsive design is important for users to be able to use your app on any device.
Here is an example of a great project plan by a Techtonica Apprentice.
Some things people have missed in past cohorts: