TENDIGI has a firm foothold in the iOS app development community, but did you know we focus just as much on design?
A brilliant app, no matter how well it functions, will inevitably fail if users have a hard time interacting with it, or if the screens aren’t visually engaging.
Focusing on our newest app DUMBO, we are going to take you through three steps of our creative process.
Step 1 – Prototyping
The most important part of any app is the user experience. How will someone engage with each screen? What do you want him to do with the information you present in the app?
To tackle these questions, we take out our UI Stencils, a thick pad of gridded paper, and a boatload of colorful pens and create a series of wireframes.
What is a wireframe exactly? It’s a diagram of the structure or “skeleton” of a product (in this case, a mobile application) that figures out the composition of various elements and how they all work together to create something that functions according to a set objective.
The wireframes that we made for DUMBO illustrate every possible screen and feature sequence a user might encounter.
After a ton of drawings, notes, and iterations, we completed the final set of wireframes that became our prototype, or initial model, of the DUMBO app. We had every feature settled, knew what every screen would do and how to navigate through the entire app. It’s incredibly important to have this all figured out before proceeding with any other aspect of the app’s creation. Finding a problem or changing your mind later down the road is costly and stressful.
The next step in the creative process is the visual design of the app. What will the app look like?
Step 2 – Visual Design
We focused on two questions while creating the design of DUMBO:
- What is the brand of DUMBO?
- What is the relationship of the content to the function of the app?
Since the DUMBO app is a neighborhood guide, we wanted to create an aesthetic that paid homage to the atmosphere of DUMBO, Brooklyn. To us, DUMBO is a quirky, rapidly-growing place with a large focus on technology and community but still has ties to its history. If you walk around the area (nestled between the Brooklyn Bridge, Manhattan Bridge and the East River) you’ll see old brick and metal warehouses converted into residences and storefronts, many covered in colorful murals, lining well-preserved cobblestone streets.
The initial designs focused heavily on conveying the industrial feel of the area. This seemed an appropriate brand for the app until we considered the second question, What is the relationship of the content to the function of the app?
Duh! For DUMBO, the app is the content. It’s a neighborhood guide that showcases everything DUMBO has to offer, and without the content the app would literally be a blank screen. With this second question answered it became a no-brainer that the design should let the content be the star.
The finalized designs show just that. Everything is clean, beautifully minimalist and “undesigned” so the user is constantly drawn to the content. Our nod to the atmosphere of the neighborhood is in the app’s logo (and every screen’s title), with a typeface that mimics the architecture and embossed metal of so many signs you’d see around.
So…the app is designed! There is one final step in the design process, a pretty important one.
Step 3 – The App Icon
The app icon is the face of the app, the first thing anyone sees when looking up your app in the App Store or opening the app on his phone. For the DUMBO app, we decided to take the design in a different visual direction from most other app icons you see on the market presently. Many companies’ app icons depict their logo in a simple, abstract manner. We want DUMBO to stand out from the crowd, so we created an icon that represents the function of the app in a literal sense.
As mentioned earlier, DUMBO is a neighborhood guide. We want this idea to be instantly recognized when someone looks at the app icon, so we created a vibrant design that mimics a leather embossed book.
The realism and bright blue make this icon pop off any screen. Download DUMBO and see for yourself!
Conclusion
Protoyping, designing the app, and creating the app icon are major components of the TENDIGI iOS app design process. The DUMBO app (as with any project we take on) is a labor of love that showcases our development and design capabilities.
