It is not like we wake up one day with a brilliant idea for a mobile app. If we are to explain it, it was more like we are forced or guided towards creating an experience. Frankly this wasn’t even exciting but more driven by necessity. In the end this was done for the amazement and the request of many of our followers.
The initial app is not even close to what we have in our drawing board, but it’s a good start. The bad part, though, is we have no clue how this will turn out to be. We know we need to do a lot of work, a lot of the right kind of work. Here we will be sharing what we have done and plan to do in building our mobile app for the Awesome Clue.
In case you are planning to develop your own mobile app, we hope this guide points you in the right direction. It’s been almost 10 months with the need to develop a mobile app, and through learning the hard way, we have divided our development process into 12 key steps.
It is always good that necessity be the driver of the ideation process, in short the application as a solution to a known problem. The Awesome Clue was a demo we created for an AI tech fair, a web application, limited to one social media network, Twitter. It was very well received with the people who have tried it, though the problem is people more often use the mobile than a desktop to access Awesome Clue. Without any marketing and promotion we get 30 to 50 unique visitors per day and on average 70% of them are mobile users (99% Android, 1% iPhone).
We took this as proof that the idea of a mobile app is worth investing time and effort. The first step itself had many more steps and did include.
All ideas need to be factually validated with mostly market research. As a matter of fact this is the most important step. Market research as surveys showed us the demand and interests of the users; accordingly, it also highlighted necessary modifications to the initial idea and gave us a clear list of requirements to prioritize the work.
In addition to surveys, open public feedbacks enabled us to;
Once the idea is polished, validated and ready, it’s time to put a shape to it, we did it with rough mockups. You can also start with a wireframe as a blueprint of your application. The important thing is to visually display the design of the app and functionality. Also, it helps to understand the look and feel of the application.
Mainly this step gives a practical vision to the theory for the team to follow and helps developers use this as a reference.
We did our first mockup on Marvel – Design & Build App and expanded it many times mostly using Pencil Project Prototyping. There are many tools that we considered, however as a startup our choices were limited to those that are freely available. Tools we considered using included, inVision, Balsamiq, Fluid UI, Proto.io, JustinMind and Figma.
As for building the mockup, on several trials we first mapped out the user flow and finalized it with several design sprints.
Once we knew what we were going to build, we decided on which technology to use and how to build it. There are two major platforms, Android and iPhone, with currently Android as our major user base. As for the use of technology there were three options available for us.
Since our current Awesome Clue web application is mobile friendly we choose to start with HTML5 web app using Flutter and slowly migrate it to a native app.
This process involved actual coding and the materialisation of the application. This involved multiple activities, like setting up the development environment, developing various parts of the codes, emulator testing and building the mobile application for installation and testing.
Each project will require its own development configurations. Our project divided those into three aspects, the app back-end, APIs and app front-end. For Awesome Clue we already have developed our backend and APIs, so it was time to start coding on the front-end. The development was done in batches and each provided interim builds that we ran on various mobile and tablet devices.
Back-end data stores and server side objects are critical components of providing various required functions, especially to be compliant to International privacy policies. Though our back-end was already done. The web application objects were also tested and future proofed at this stage.
The API exposes the Artificial Intelligence part of the Awesome Clue, which was already developed for the web application. Though the code base had to be refactored considerably. The API also included specifications on how various components interacted with each other. Many changes were made to make this ready for channelled data input and output.
The front-end aka “client-side” is the public facing and interacting components. This implementation requires structure, design, animation and dictated the behavior of the mobile apps.
We are not specialized in mobile app development, so at several stages there were discussions of handing over the design to a third-party app development company or a freelance developer. In the end we decided to learn Flutter and Dart was an easy language to learn, and after we got our heads around asynchronous programming, various tutorials were enough as development starting blocks.
To avoid major bugs it’s critical to run a code review process tied to the development stage before deployment. Given the small development cycle, we currently test the app manually, though we do have plains to automate part of these tasks.
Once we have an emulator based development tested for visual appeals and functionality, it’s time to conduct a final test of usability with colleagues and platform installations. This process usually highlights bugs that we overlooked in the development stages, and this is the stage we apply the final tweaks.
Review & Testing is not limited to coding alone, it needs to be included at all stages of the ideation, development to deployment cycles.
Functional test, test to align the mobile app according to the selected industry requirements. The functional testing is conducted through these focus areas:
This is to ensure that the app is usable to all users and generates the intended interface that acts according to our selected standards. This test confirms if it is a stable, easy-to-use and would the app actually attract users. Our usability of the app is scored by three criteria:
User Interface testing ensures the mobile app’s graphical user interface meets all selected specifications.
Compatibility/Configuration testing provides the optimal performance of the mobile app according to the device size, version, screen resolution, hardware, etc. moreover, compatibility testing takes care of:
Performance testing ensures the mobile application reaction and consistency under a specific workload. Our performance testing includes:
Security testing process validates the security concern of the mobile app. Also, it checks the risks of mobile app hackers, viruses, protection, and unauthorized access to all the sensitive data.
A beta version of the application usually brings early adopters, which is an important step in taking the mobile app to mainstream and providing them life long incentives. From our web application we have found that the early adopters provide a lot of beneficial feedback about pros and cons. And their experience and rating is a guide to understand the acceptance of the app and the demand as well. This type of word-of-mouth marketing for the mobile app bolster reputation, and help to acquire even more users.
Documentation comes first, at all stages, though it starts to shape out at this stage and this is the stage where it becomes preparatory and confidential. Any documentations done prior to this stage include details like screen layouts, navigational charts, and other important aspects that are obscure on the design. From here on we need to check all the core and initial features for completeness and irregularities. In this phase, we find out all the issues and resolve them before the app development ends and fine tune the project for release.
As of this writing the Awesome Clue is not officially launched because we have yet to fully complete this step to our satisfaction.
We have launched an app for internal use, DevOps, an mobile application just to learn and get a hang of this step. So once the mobile app is ready for launch, we know the steps we have to follow to submit the app to both the Google Play Store and Apple Store.
After launching the mobile app, the next and crucial step is marketing it. If people don’t get to know about the app, then there is no chance of downloading. To spread the app and convince people to install it, we need to make attractive and informative graphics & videos that show the app’s functionality.
In the past, for clients, we have successfully used social media for mobile application promotion. For a mobile application it totally makes sense to use all digital platforms to reach every corner of the world. Just delivering people a glimpse of the app and highlighting key features simplify the decision process of the user.
As a research based startup, we want to explore creative ways we can go about this stage and will share our future findings
We are no expert in support services either but we believe our responsibilities do not end when an application has been created and launched. We have to clearly offer support and maintenance solutions for the mobile application users.
Right now we don’t even have a dedicated support and maintenance team. Though we have in the past for clients provided support services, including:
We will share more details and our learnings as we go along, stay tuned.
The mobile application development process is both exciting and exhausting. But, it is worthwhile if done in the right manner. We have shown the sequential step by step process we followed, but do remember you do not have to follow it as it is. These can be applied in varying orders that seems fit but we believe all these steps are required in some form or another.
Thank you for taking the time to read this and if you have any doubt, question or want to know anything in detail, do get in touch.
Happy building and Keep building