React Native: Idea to Product in One Week

Christopher Smith
Oct 7, 2016 · 12 min read
Image for post
Image for post
Peruse — design industry news.

Decision Making: Keep. It. Simple. Stupid.

We kicked-off with a few different ideas about what we could prototype or build to test our assumptions about the React Native framework. But, we didn’t necessarily want to spend a lot of time testing out complex features or going all-in because we have awesome clients that we spend a lot of time working with.

  1. Don’t overthink it.
  1. Provide an app that has at least some value with the experiment (no throw away code)

Colorful, Animated & Designery

It took us about 8 names shouted out (into Slack) and a bit of thesaurus searching to come up with the name Peruse.

Image for post
Image for post
A screenshot of some of the app icons we liked.
Image for post
Image for post
Josh Frank’s initial sketches
Image for post
Image for post
LeAnne Wagner’s initial concept development.
Image for post
Image for post
The finalized logo & loading screen by me.
Image for post
Image for post
Left: Peruse logo, Right: Adjust Creative logo

Getting Started with React Native

Josh wrote an article explaining React Native from a non-programmer’s perspective and we’ve programmed a couple of applications for web browsers using React. I’ve developed applications with iOS and helped with some on Android in the past. So, we had a pretty good understanding of the platform and what it brings to the table.

Get that data!

First things first, I needed some data to play with. Luckily, Yoni Weisbrod wrote a great article about loading data with React Native.

Loading, loading, spinny wheels, bla bla…

Did you ever see the website Pretty Loaded? Some friends over at Big Spaceship made it back when I was working at Domani Studios. We made a lot of websites with Adobe Flash and since they were pretty heavy files, most of the time we needed SICK PRE-LOADERS BRO. (look for the one with dripping countdown)

Custom Swipes and 3D transitions and stuff

This was the only part where I didn’t get to use the simple React Native components. It took the longest because I had to custom program the View controller.

Image for post
Image for post
  1. SafariView opening an in-app browser view on iOS versus Linking.openURL just opening Android’s default browser.

We’re done here. For now…

I had a great experience developing this simple app, I’m excited to see the React Native community grow and I can’t wait to dig in to something a bit more robust using the framework.

Best GIF on the interwebz.

Designers and Developers:

We would love to see this app grow with the help of the design community with new features and control over feeds. If you’re interested in contributing or making it better, please comment below and and maybe we can fork the project, add you as a developer on Github or at least get a feature request roadmap on Trello.

Other Resources

Here are a couple more links & code chunks that were valuable enough to share but didn’t really fit into the article.

Adjust Creative

We think good design matters and this is our place to talk…

Christopher Smith

Written by

Chris has 16+ years of experience producing award winning work with design, music, programming and mentorship.

Adjust Creative

We think good design matters and this is our place to talk about those thoughts. We also define, design & build cutting-edge digital products for brands & innovators.

Christopher Smith

Written by

Chris has 16+ years of experience producing award winning work with design, music, programming and mentorship.

Adjust Creative

We think good design matters and this is our place to talk about those thoughts. We also define, design & build cutting-edge digital products for brands & innovators.

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store