In this third part of this seven-part series, we look at the development of the User Interface (UI) product screens, which takes place once the scoping, wireframing and design processes have finished.
PRODUCT DEVELOPMENT BROKEN DOWN
The development process is broken down into various phases and deliverables. Typically the development comprises of three main areas: the interface development, the front-end functionality and the back-end functionality.
Typically all mobile, web apps and digital products are designed and built for desktop, tablet and mobile devices. This is known as responsive design and development. Meaning that we develop these interfaces once but apply clever technology and features to allow the page or screen to respond to the screen size that it is viewed upon and display all the on-screen/page elements accordingly.
During this phase it is possible to add animation to the project, giving it a slick and user-friendly feeling, allowing content and sections to show or hide quickly without navigating to other screens/pages. Animation can include how menus open and close, how users are guided from one section to another or how content is visually displayed and expanded, in order to make maximum use of the screen “real estate” while still providing a pleasant user experience.
Some of the tools we use are:
- TinyPNG, to optimise images so that they are smaller in size but still retain their quality.
Front End Functionality Development
The front end development comprises of the development of all the functional elements that the users of the mobile app/web app / digital product will make use of. This not only includes functionality that the general public will interact with but also the functionality of all the different user types that would use the system.
A simple example to illustrate this would be Airbnb. The general public would be able to browse and search for properties based on their personal requirements, however, once this user then books a property they would then have access to an additional set of functionality, where they can view their bookings, interact with the property owner, etc. Likewise, the property owner would also login to their profile and then have access to all their property information, bookings, etc…
Another functionality that can be developed for the front end is endless. Here are some common pieces of functionality that are often developed as part of projects: forms, galleries, BLOGs, multi-language implementation, currency conversion, ratings and reviews, etc.
In fact, any interaction with data and management of records as well as any other interactivity that the user performs on the product is generally considered functionality.
The development of the front end functionality is specific to the product, which is based on the project scope and the wireframes produced and therefore custom for the product at hand and the client’s unique requirements.
Watch this space for our next article in this series where we delve into the intricacies of Back End Functionality and API development.