How do you go about designing an app?
- Everything starts with an idea, it could come from you, or the client. getting the ‘right’ idea isn’t that important.
- Keep the idea malleable and changing as long as you can
- Is this idea financially viable?
- Is this idea technically feasible?
- Is someone already doing this?
- Could this be made similar/differently?
- A spec or specification (blueprint) is a piece of paper that declares what your app does and how it is accomplished
- Also called low fidelity mockups, either part of the spec or built from it. normally done by Information Architects (iAs) or User Experience Designers (UX Designers)
- Go through the spec, screen by screen, and mark up the app interface by page, helping identify inconsistencies in navigation, and or missing sections or links
- It’s about creating a bare-bones version of the app with the goal of testing your hypotheses and get early feedback
- Some people use tools like Invision or Marvel where you can convert your low-fidelity mockups into interactive “apps” that allow you to tap through the design
- Different factors lead to how you choose to prototype your app. A bad experience with a prototype might cause you to uncover issues with your wireframes, your spec, or even the very core of your idea
- Visual Design:
- Deals with the appearance of the app
- Not just about making it looks nice but making sure theres a consistent and identifiable visual language throughout its entirety.
- It is to help communicate your brand and guide the user throughout the app.
- It is a visual framework you use to create a coherent and consistent experience and differentiate your product from others.
- Development shouldn’t be devoid of a design presence and design shouldn’t be without development know-how.
- They don’t always however involve each other in the processes
- Get an idea
- Write it down
- Build a prototype
- Enter into the dance between design and development until something comes out of it
What is an app?
- Application, is a software program thats designs to perform a specific function for the user
- Web App / HTML 5
- Responsive web design
- stored on a remote server
- elements of both native and web apps
- run directly on a mobile device
- doesn’t need a web browser, it is single platform
- More than half surveyed said, a poor app experience would put them off using the company products, therefore those using HTML 5 or Hybrid would have had lower ratings by the consumer, where as those using Native, gain an instant advantage
Mobile Website or Web APP?
- PROS :
- A quick option for making existing content available via mobile device
- only needs to be built once and would be usable for every device
- CONS :
- user experience inferior
- performance inferior
- its an app world
- PROS :
- a mobile app build with HTML5 gives you the ‘space’ on a user’s phone that can be used to bridge some of the gaps between native apps and mobile website
- HMTL5 or hybrid (wrapped) apps attractive for internal teams that have web skills
- CONS :
- Low/no bandwidth an issue
- No unique mobile functions
- PROS :
- UI and UX smooth and engaging
- device capabilities optimised
- faster load times compared to web apps
- robust performance in online or offline mode
- better discoverability and brand image
- Superior security compared to HTML5
- CONS :
- Require development for each mobile platform
What types of apps are there?
- Social Networking
** REMEMBER : the purpose of an app is to make peoples lives easier!
As Designers, what do we need to know about app Design?
- Users expect familiar User interface (UI) controls
- Touch input – Gestures change everything
- High resolution is taking over (higher pixel count per image, making images clearer and sharper, you need to consider this in relation to screen size etc)
- Time is short (clean presentation, and no complex navigation)
- The real estate is tiny (the screen is small, and the buttons need to be in a good separation in order to be selected easily)
- Context is everything (App users are looking for specific information, i.e. a restaurant app should say, location, and trading hours in an easily accessible area)
- Wireframing is essential.