Building the MVP for an Unexpected Demo

Milestone Mondays

Current Project : Bitter Renter
The no-nonsense guide for first-time renters in NYC.

The story of how I got an opportunity to demo at New York Tech Meetup is quite interesting but I’ll leave that for an upcoming, related post. Long story short, last week I got accepted to present Bitter Renter at the upcoming NYTM tomorrow, August 2nd.

While this was an exciting opportunity for me, I immediately panicked. How was I going to build everything in 6 days? I could if I didn’t mind being sloppy but I mind that very much so I had to get creative.

There are so many paths a user can take but in reality I only need one to get the idea across. I chose to go with the “I may rent by myself” on a “new lease” flow since most of the designs have covered that.

Deciding What Language to Code in

My primary backend language is PHP but I also know just enough Rails. Though I typically like to choose the path of least resistance, something was telling me to choose Rails this time around and so I did. This definitely added more complexity to the build because I’m a little rusty and have never coded in Rails without support. Nevertheless, I’m pretty happy with my decision. Thank God for Google!

Deciding Where to Start

When I build, I like to go all in from the beginning — from responsive styles to functionality in each screen. This way, I don’t have to worry about changing the structure every time to solve a new problem. I think about how everything works together the first time.

Unfortunately, this was not going to fly this time around. Instead I started with identifying the data models and hooking up the flow without paying attention to style. This made it easy to concentrate solely on the functionality and not worry about looks. Once I had that working I shifted gears to the front-end styles, focusing on desktop but using flexible values.

Deciding What to Make and What to Fake

There are few components that I knew would not be flawless in time for the demo so I had to decide which features I would make or fake. My choices were based on what I foresee showing in the demo.

  • I made the calculator update on the fly.
  • I made the dropdown to select different boroughs.
  • I faked the map change that happens when you change the borough.
  • I faked the average rent prices in each borough.

Making Lists and Checking it Twice

I’m a big fan of lists and when I’m feeling overwhelmed about what I have to do for a new project, I try to write down everything that’s in my head. So, I wrote down the exact flow I would be making for the MVP, detailing the user actions, backend responses and even redirects. It was extremely helpful to have this while coding. It kept me focused and eased a little of my anxiety.

I’m just about ready for tomorrow.

I’m pretty proud of myself for knocking out more than half the site in just a few days of coding. I’m excited to show it at the NYTM tomorrow! :)

There are a few things I’ll want to focus on this week: the map functionality, hooking up the remaining flows and some animations, finalizing content and mocking up any outstanding screens.

Have fun creating,
– Kim

Kim is a chronic creator, designer and coder. Maker at @bybourn, curator ofHashtags Unplugged and creator behind , sendthanks.toand