At FaceySpacey we produce layouts of every page of your application, and every state each page can be in. We do so in combination with a simultaneously running branding phase where each phase/aspect works off each other--we’ll talk about the importance of graphic design while speccing later. The imagining of these layouts is what we do best and the most important first step in planning your applications. It’s where you explore deep into what you’re app could and should be.

Lots of startups have to build lots of potentially useless stuff in order to see far into what your application needs to be at launch. This can lead to wasting lots of money on developing code you ultimately won’t use. So in essence you need to master being able to predict what you’re application needs to become if you plan to save time and money.

To master this skill, you need to think about it like a process rather than an end result. It’s not one set of layouts you make. Rather, it’s many sets and revisions that evolve. Like, don’t expect to do one round, or 3. Expect to be constantly evolving your layouts and learning more about your product through layouts. It’s way cheaper to learn about your product in Photoshop or Microsoft Paint than it is in code. Explore all the possibilities for how you’re app may look and function. Connect one interface to another. If you have a list of stores, create a page that lists the stores, put an edit/create button in the top right, then make the edit/create page, etc. Then on the edit/create page when you realize you must assign coupons to your stores, go make a coupon list page, and then a coupon/edit/create page, etc.

I’d like to say that if you’ve narrowed your scope well, the pages you need to create will be a small list, but the reality is that you’re both narrowing/optimizing your scope (as described in the last tutorial) while making these layouts. You’re constantly learning about what you’re product is. If this phase goes successfully, you’ll most likely have scrapped entire visions for your application, and removed many sub-concepts of each vision, etc. You may start out with one idea and totally change it to something more viable. During this phase you’ll discover your core value proposition, and when you do you’ll realize everything else that you have to scrap.

The goal is to get your application to a point where you can navigate through your screenshots and pretend like you’re using your application. No button can’t have a page missing for it, even if it leads to a modal popup. If it does, make another layout with the same page in the background, but the modal popup on top of it.

Making these layouts is really an important skill. This tutorial was an overview of the end goal you’re looking to achieve here, i.e. a navigatable set of layouts. In the following tutorials we’re going to break it down further. Stay tuned.