The home page

The design mockup

The tools I use to mockup

When I start a project, I like to start with the design mock up. For several reasons: it helps to see the project out of the box. I mean, it’s better than setting up the architecture or the database because you may miss something that a quick feedback on your mockup can bring.

There are a lot of way to mockup your app. You can use software such as Photoshop or Gimp. I feel better with Power Point or Balsamic Mockup. Yea, I really think you can do a nice mock up with Power Point. Even more once you downloaded some package given by Microsoft which contains a lot of control and icons ready to use. When I realize a mockup, I don’t focus on the final design. The screen I design are a cross between wire frames and final screens. If you spend more than an hour designing a screen, you are probably doing it wrong: don’t spend too much time because it can be a waste. The simpler your mockup are, the more understandable your app will be.

Balsamic Mockup is an amazing software I discovered 5 years ago. I felt in love with the look & feel of the result. It’s also easy to customize and to set up.

SDF mock up

You can click on the image below to open them in a new tab in full screen.

The “home” & “menu” page:
As you can see, the home page will be light. I also add some info on the kind of animation I would like to add.

1 - Home, menu

The “around me” page:
This page will be the core of the app. It is where user will perform actions like reporting if a homeless people is still at the same spot, if he has cover, foods or something like that.

2 - Around me

The “my activities” page:
The page where the users will see the summary of their reports.

3 - My activities

The “wall of fame” page:
A page that shows who help a lot.

4 - Hall of fame

The “about” page:
A page where I will put every other information. I still don’t know what it will say.

5 - About


Notice that I still don’t have the app icon. It’s something that can wait. I will focus on the application icon once it will be mature enough.
I don’t see the point of making an icon if you don’t develop and publish the app. I already made this mistake: I spend few days on the icon, the name of the app, the splash screen but I never ended this project. It was a waste of time: it would have been smarter to spend those time somewhere else.