2

How to Plan Like a Pro: Part 2 of 2

 2 years ago
source link: https://hackernoon.com/how-to-plan-like-a-pro-part-2-of-2-mbaj351m
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.

How to Plan Like a Pro: Part 2 of 2

5
heart.pngheart.pngheart.pngheart.png
light.pnglight.pnglight.pnglight.png
boat.pngboat.pngboat.pngboat.png
money.pngmoney.pngmoney.pngmoney.png

@pasbynumbersPas_byNumbers

An inquisitive programmer with a strong passion for Music and Technology

“Strategy without tactics is the slowest route to victory. Tactics without strategy are the noise before defeat.” — Sun Tzu

0 reactions
heart.png
light.png
money.png
thumbs-down.png

The first post in this mini-series went over both a generalized outlook of planning a project.

0 reactions
heart.png
light.png
money.png
thumbs-down.png

This post applies methods that I use in particular when piecing together ideas for code and will be in reference to my final Flatiron project.

0 reactions
heart.png
light.png
money.png
thumbs-down.png

Brainstorming

Coming up with the right idea is where the real heart of the vision lies. You want to make sure your idea is both viable and possible with the resources at hand. Otherwise you are bound to fail in its execution, with no pressure.
Let’s look at how this process can be approached.

0 reactions
heart.png
light.png
money.png
thumbs-down.png

Is there a gap in the market?

0 reactions
heart.png
light.png
money.png
thumbs-down.png

This is how most ideas start in business, and this applies to development as well. It all starts with a foundation that’s either hard to find elsewhere or has plenty of room for improvement.

0 reactions
heart.png
light.png
money.png
thumbs-down.png

You can also find a good starting point by finding a problem either generalized or personal and making your project the solution to said problem.

0 reactions
heart.png
light.png
money.png
thumbs-down.png

Consider the scope

0 reactions
heart.png
light.png
money.png
thumbs-down.png

This aspect has two sides. One of which is how grand in scale is the idea? You have to be realistic here and not attempt to solo a project that would benefit from a team-based approach and vice versa. The other is that 99% of dev projects will need more work to carry on the flame after the first version/M.V.P is completed. Hence, we are called developers. Keep that in mind when assembling ideas.

0 reactions
heart.png
light.png
money.png
thumbs-down.png

Directing the vision

0 reactions
heart.png
light.png
money.png
thumbs-down.png

This is where you will start to piece together the ingredients of the idea, so it all makes sense and has its own direction. If you do this well, you’ll find moments when the idea even directs itself.

0 reactions
heart.png
light.png
money.png
thumbs-down.png

How would you categorize your app? What frameworks and libraries might you need? What features are essential and should be prioritized?

0 reactions
heart.png
light.png
money.png
thumbs-down.png

As you can see, depending on the scope of your idea, a lot of thought will need to go in o this aspect of brainstorming, but you don’t have to write it all down. Provided that the vision is clearly defined, it can end up working itself out.

0 reactions
heart.png
light.png
money.png
thumbs-down.png

The Breakdown

From this point on, I’ll apply the previous concepts to my final Flatiron project. We’ll start with the third point from above, seeing as it combines all the other concepts as well. First, let’s look at an app breakdown template that I swear by. Feel free to use this with your own projects.

0 reactions
heart.png
light.png
money.png
thumbs-down.png

Aim
Outline the vision and intentions behind your idea. This should only be a short bio describing the general direction of your project is.

0 reactions
heart.png
light.png
money.png
thumbs-down.png

Data Models / Entities
Each app will have its own outline of related data. For instance, in a To-Do List app, you may have a model for Users and a model for the To-Do Items.

0 reactions
heart.png
light.png
money.png
thumbs-down.png

Main Features
These are the bread and butter macro-functions of your app that help it commit to its aim.

0 reactions
heart.png
light.png
money.png
thumbs-down.png

User Stories
From an app user’s point of view, describe what is possible with the app and what the flow of usage may look like.
It should be described like this:

0 reactions
heart.png
light.png
money.png
thumbs-down.png

- A user can create a To-Do Item
- A user can edit a To-Do Item
etc.

0 reactions
heart.png
light.png
money.png
thumbs-down.png

Stretch Goals

0 reactions
heart.png
light.png
money.png
thumbs-down.png

After completing your MVP and your main features and successfully implementing all the possible user stories, what new features can you add to upgrade the capabilities of your app? (This is prone to change).

0 reactions
heart.png
light.png
money.png
thumbs-down.png

Considerations

0 reactions
heart.png
light.png
money.png
thumbs-down.png

Mention any parts of the project that:
- Needs to be prioritized
- May be difficult to implement or requires extra attention
- Is dependant on a library or module

(This is prone to change)

0 reactions
heart.png
light.png
money.png
thumbs-down.png

M.V.P (Minimum Viable Product)
Last but not least is our M.V.P, and I don’t mean the most valued player, quite the opposite actually. The minimum viable product is the bare-bones build of your app that includes only the most necessary aspects and features required to commit to its aim, essentially amounting to your first completed version.

0 reactions
heart.png
light.png
money.png
thumbs-down.png

Concerns -optional-
Here is where you would detail any problems you are currently having with your project and need to be addressed. Some devs prefer to have this section in a separate file within their codebase. The choice is yours.

0 reactions
heart.png
light.png
money.png
thumbs-down.png

Welcome to MotiveRate

I made this design draft in Figma. While my website never actually ended up looking like this, it was pretty close, so I definitely recommend sketching out a simple UI interface to help you stick to a design for your app.

0 reactions
heart.png
light.png
money.png
thumbs-down.png

Below is a condensed plan for my MotiveRate App.​

0 reactions
heart.png
light.png
money.png
thumbs-down.png

Aim

0 reactions
heart.png
light.png
money.png
thumbs-down.png

A single-page app with the capabilities to make goals that improve personal motivation. There is also the ability to earn points through completing your actions and receiving support from peers.

0 reactions
heart.png
light.png
money.png
thumbs-down.png

There will be a focus on strong UI / UX integrations to facilitate better use of the app.

0 reactions
heart.png
light.png
money.png
thumbs-down.png

Main Features

0 reactions
heart.png
light.png
money.png
thumbs-down.png
  • Goal Creation
  • Sharing updates on completed goals
  • Currently trending keywords and categories
  • Points system
  • Providing support to other members goals
  • Mobile-Friendly

​Stretch Goals

0 reactions
heart.png
light.png
money.png
thumbs-down.png
  • Image Viewer
  • Keeping notes on current goals (private)
  • Events and Calendar Scheduling
  • Gratification / Rewards for Goals (avatars, themes, awards, etc.)
  • Share on Facebook / Twitter

Models

0 reactions
heart.png
light.png
money.png
thumbs-down.png

User

0 reactions
heart.png
light.png
money.png
thumbs-down.png
  • username
  • password
  • email
  • first_name
  • last_name
  • score

Goal

0 reactions
heart.png
light.png
money.png
thumbs-down.png
  • title
  • description
  • category
  • deadline
  • isCompleted
  • User_id |ƒ| (the ‘f’ stands for foreign key)
  • isArchived

Update​

0 reactions
heart.png
light.png
money.png
thumbs-down.png
  • supporters
  • User_id |ƒ|
  • Goal_id |ƒ|

User Stories

0 reactions
heart.png
light.png
money.png
thumbs-down.png
  • Can create and edit account details
  • Can create and edit personal goals
  • Can earn points for completions
  • Can share and edit updates in relation to goals
  • Can support another user’s completions and updates with extra points
  • Can archive goals and related updates

Considerations

0 reactions
heart.png
light.png
money.png
thumbs-down.png
  • Updates/Experiences are ways for users to share their stories and completions as well as receive extra points from other users.
  • Will likely use MaterializeUI library with react

Seed Profiles:

0 reactions
heart.png
light.png
money.png
thumbs-down.png
  • “Mangamojo” — manga artist
    “culinature” — chef
    Miasma” — DJ
    NorthernLight” — Director
    inFinityAdVenturer” — World Traveller
    Kimpossible” — Novellist
    AzirInn” — Property Management and Development
    MartialSoul” — Martial Artist and Stunt Double
    WyvernTech “— Application Security Specialist
    Serenathena “— eSports gamer

MVP

0 reactions
heart.png
light.png
money.png
thumbs-down.png
  • Rails backend API with a PostgreSQL database
  • Each model has its own designated API endpoint and relationships between models can be easily distinguished
  • 10 users, 10 goals, and 12 updates as seed data
  • Set up basic frontend built on react + redux that can receive data from back end API
  • Home page/landing pageUser page that displays your dashboard/profile for organizing your data
  • CRUD functionality for users, goals, and updates
  • Intuitive points system
  • Professional styling with strong UI / UX layout
  • Publicized updates through users sharing experiences and completions

Concerns

0 reactions
heart.png
light.png
money.png
thumbs-down.png
  • Delay when passing downstate to profile component.
  • Profile component doesn’t re-update without a refresh (no need to fix unless rendering profile immediately after login/signup).
  • Need the ability to individually select what to edit (user).

Wrapping up

I believe that the concepts introduced here are really all you need to make the best start possible and commit to the ideas behind your projects.
More detailed templates and action plans exist depending on the companies and teams you work with. It’s up to you to adapt your style of strategy and tactics to the methods of your work environment.

0 reactions
heart.png
light.png
money.png
thumbs-down.png

Code in Peace

0 reactions
heart.png
light.png
money.png
thumbs-down.png

Also published here.

0 reactions
heart.png
light.png
money.png
thumbs-down.png
5
heart.pngheart.pngheart.pngheart.png
light.pnglight.pnglight.pnglight.png
boat.pngboat.pngboat.pngboat.png
money.pngmoney.pngmoney.pngmoney.png
by Pas_byNumbers @pasbynumbers. An inquisitive programmer with a strong passion for Music and TechnologyRead my stories
Join Hacker Noon

Create your free account to unlock your custom reading experience.


About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK