KEMBAR78
Chapter 2 | PDF | Mobile App | Cross Platform Software
0% found this document useful (0 votes)
44 views50 pages

Chapter 2

Chapter Two discusses the factors involved in mobile application development, including the mobile software engineering process, key phases of development, and essential considerations such as UI/UX design and security. It outlines the importance of strategy, audience research, and testing, while also highlighting various frameworks and tools available for developers. The chapter emphasizes the need for a solid app development strategy and ongoing monitoring post-deployment to ensure success.
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
44 views50 pages

Chapter 2

Chapter Two discusses the factors involved in mobile application development, including the mobile software engineering process, key phases of development, and essential considerations such as UI/UX design and security. It outlines the importance of strategy, audience research, and testing, while also highlighting various frameworks and tools available for developers. The chapter emphasizes the need for a solid app development strategy and ongoing monitoring post-deployment to ensure success.
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 50

Chapter Two

Factors in Developing Mobile


Applications

Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 1


Contents
 Explain Mobile Software Engineering

 Mobile app development process

 Identify the factors of developing mobile application

 Mobile frameworks and tools

 Develop mobile generic UI

 Android User
Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 2
Mobile Software Engineering
 MSWE is the adaptive process of creating a software product that is intended to be used by people
while they are mobile.

 By this, the process must take into account the specific characteristics of mobile usage to deliver
the required quality.

Mobile application development is the set of processes and procedures involved in writing
software for small, wireless computing devices, such as smartphones and other hand-held devices.

 It’s the process of making software for smartphones, tablets and digital assistants, most
commonly for the Android and iOS operating systems.

Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 3


Mobile app development process
 Mobile application development process span six key phases such as Strategy, analysis and
planning, design, app development, Testing and deployment.

Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 4


1. Strategy
The first step of the mobile app development process is to produce a strategy to determine how your
business can improve through a mobile app.
 How will your customers benefit?
 How will your employees or business partners?
As one app’s objectives may differ from another, there is still an app-specific impact to the mobility
strategy to address during the development process. A well-defined strategy should help you
address “why” for your mobile development initiatives. It helps focus your vision on a clear picture
of your app idea. In this phase, you will:
 Define your app’s purpose
 Identify your app’s audience
 Research the competition
 Establish the app’s goals and objectives
Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 5
2. Analysis and Planning
 At this stage, your app idea starts taking shape and turns into an actual project.
 Analysis and planning begin with defining use cases and capturing detailed functional
requirements.
 After you have identified the requirements for your app, prepare a product roadmap. This
includes prioritizing mobile app requirements and grouping them into delivery milestones.
 Part of the planning phase of developing an app includes identifying the skills needed for your
app development initiative. For example, iOS and Android mobile platforms use different
development technology stacks.
 Have you selected the name of your app? Mobile app names are like domain names and must
be unique within each app store. Research each app store to ensure your app’s name isn’t
already in use.
Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 6
3. UI / UX Design
 The purpose of an app design is to deliver seamless and effortless user experiences with a
polished look. The success of your mobile app will depend on how well users adopt and benefit
from its features.
 The goal for mobile app UI and UX design is to create excellent user experiences, making your
app interactive, intuitive, and user-friendly. While polished UI designs will help with early
adoption, your app must have intuitive user experiences to keep app users engaged.
 Mobile app designers often start app design with sketches on paper.
 Wireframes are the digital form of sketches. Wireframes are conceptual layouts – also referred
to as low-fidelity mockups – that give visual structure to your app’s functional requirements
 Creating wireframes is a quick and cost-effective approach to mobile app design. While
creating wireframes, you should consider device specific UI design.
Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 7
 Style guides document your app’s
design standards, including the color
scheme, typefaces, and graphics,
according to your company’s branding
guidelines.
 Mockups, or high-fidelity designs, are
the final renderings of your app’s
visual design. Mockups are created
by applying your style guide on to the
app wireframes. As your app’s design
begins to finalize, expect further
modifications to its information
architecture, workflow and aesthetics.
 Interactive Prototype - simulate the
user experience and demonstrate how
the app will work as the finished
product.
Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 8
4: App Development
 Now that the design phase is complete, it’s time to move on to one of the most important stages of
your mobile app development process. Typically, it’s made up of two main parts backend and
frontend.
 The backend involves creating databases and server-side objects that are
responsible for your app performance.
 Choose appropriate programming languages and begin coding the app.
Additionally, database engines and a hosting environment will be
selected.
 It’s crucial and determines the scalability of your mobile app in the
future.
 The front-end is the native mobile app an end-user installs and interacts with
on their mobile devices. There are three main approaches to building it.
 Platform-specific- created exclusively for each mobile platform.
 Cross-platform- run on different platforms with one single codebase.
 Hybrid- contain elements of both platform-specific apps and web
applications.
Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 9
5: Mobile App Testing
After all, you want to make sure the developed solution is stable, secure, and doesn’t have any
bugs. For the highest quality delivery, your app should undergo five testing methods prior to
deployment.

1. Functionality - check the features of your application and ensure


that everything works well.
2. Performance – test app’s responsiveness and how it handles an
increase in concurrent users.
3. Security - check that your app adheres to all security standards
and that there aren’t any loopholes in your system.
4. Platform and Device With new mobile devices coming to market
yearly and operating systems updating monthly, it’s important for
your application to stay on top of compatibility. Hence, it has to be
tested on various devices or simulators.
5. Extended Review - Before proceeding to deployment, it’s a good
idea to test your application with its actual final users.
Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 10
6: Deployment and Support
When you’re finally ready to deploy your app, you’ll have to go through different distribution
models depending on the platform you were developing for.
 To release your native mobile app you must submit it to the appropriate app store, Apple App
Store for iOS apps and Google Play for Android apps. Once your app is finally live and users
are steadily downloading it — it’s time to get your analytical hat on and monitor performance.
Some of the most important KPIs you should look at are:
 App downloads and Active users
 Average visit time
 Retention and Conversions
 Customer lifetime value
 Ratings and Reviews
Mobile apps require regular updates to keep up with the latest
operating system changes, review guidelines, and performance standards.

Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 11


Factors that influence mobile application development process.
1. Distribution Channel - As a developer, you must first identify which platform best supports your
grand idea.

 Though Google Play Store and Apple App Store serve the same function, they have different
guidelines. You can view the description, icon, logo, screenshots or image gallery, and a
snippet or a trailer of the app on both platforms. However, there are few elements that
differentiate one from the other.

2. Audience Research - For your idea to become successful, you must first conduct audience research.

 Knowing audience involves understanding the industry and getting in-depth knowledge about the
people that might take an interest in apps. It is important because users tend to be diverse. You
must track the demographics of the users of your app.
Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 12
Cont…
3. App Idea - you must first examine your idea before you can begin working on it.

 It must first check if the design is unique or not. Besides being unique, your app idea must
satisfy a need. Most of all, you must be able to differentiate your idea from what’s already
available on the platforms. It must also be able to resolve the weaknesses of the existing
competitive apps.

4. App Development Strategy - To properly execute your app idea, you must come with a plan.

 In this case, you must have a solid app development strategy. A cohesive strategy answers
all the questions you have towards the app development process. It clarifies how much of
the design work you will undertake for the app development. Part of your app development
strategy must include the strengths and weaknesses of each mobile device.

Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 13


Cont…
5. UI/UX - User interface (UI) and user experience (UX) are part of what keeps users
hooked on an app.

 Users prefer apps that are “handier” compared to those that require too much effort to operate. For
example, an app with low-res images, slow loading times, broken sign up/ login functionality and app
navigation, and poor connectivity to social profiles are all signs of poor UI/UX. Unnecessary micro-
interactions, lags or unresponsive clickable elements, inappropriate spaces, and mismatch fonts types
and size are some of the factors you should watch out for when developing your app.

6. Testing - Developing and designing your mobile app idea is only half of the job in your mobile app
development journey. It’s a way to secure that your mobile app has no exceptions and bugs. If you launch
your app without testing it, you can run into problems that can spark fires that are difficult to put out.

Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 14


Cont…
7. Security - Security must be part of your app development process.

 Users should not have to think of the threat of malware when they use your app. Thus, you should
leverage the security features of the device’s OS. You can also keep the user’s information safe
through encryption.

 You should also restrict your app’s permissions to a minimum. Always prioritize security to ensure
your app isn’t vulnerable to external threats.

8. Monitoring - You still have work to do after you publish your mobile app. You must be hands-on with
fixes, performance improvements, changes, and integrating new features.

 As a developer, you must track crashes and look at technical information to help you resolve the
problems users encounter. You can also check into analytics as well as recommendations and reviews
by users to see how well the market responds to your app.

Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 15


Main considerations for mobile app design

Intended utility of the mobile app- Consumer engagement with richer user experience.
Productivity through efficient flows. Driving incremental revenue through user stickiness.
Customer conversion. User loyalty through targeted and personalized offers

App Architecture- Native vs hybrid vs web based on the requirements. Middleware requirement
for centralized configuration. Offline vs online capability for storing data

Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 16


Cont..
App Development Principles- User experience through richer controls and interactive
components. Compatibility on various devices and platforms, Performance for each screen
and task, Security for data, Productivity enhancement tools.

Target users - Consumers for B2C apps, Business for Business to Business (B2B) apps,
Partners for B2B apps and Employees for Business to Employee (B2E) apps.

Testing- Device testing, Performance testing, and Various testing scenarios.

Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 17


Challenges in mobile application strategy
 Diversity of devices and heterogeneous technologies: There are various mobile
platforms and devices. The app should provide optimal experience in all the scenarios.

 Security: Mobile app should ensure data security during transmission and during storage.

 User experience: Mobile app should provide optimal user experience leveraging the
device capabilities to provide highest engagement possible.

 Network: Mobile app should be designed to work in regions with network, latency and
bandwidth challenges.

 Compliance to diverse standards, OS, mobile platforms and devices.

Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 18


Frameworks and Tools

 A mobile development framework is a software framework that is designed to support


mobile app development. It is a software library that provides a fundamental structure to
support the development of applications for a specific environment.

 Platforms- In the field of mobile applications, we primarily develop apps and programs
for the following platforms:

iOS

Android

Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 19


Frameworks
The Top Android Development Frameworks that are currently most popular and so important to learn in
2023.

Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 20


1. Flutter
Flutter is an open source framework by Google for building beautiful, natively compiled,
multi-platform applications from a single codebase.

 It is a revolutionary SDK for cross-platform app development that stands out as it uses a
unique approach for delivering apps with a native-like look and feel.

 Flutter is a complete framework that includes widgets, a rendering engine, testing and
integrating APIs and tools to help developers build and deploy aesthetically pleasing
mobile apps.

 Examples of apps built using Flutter development include Google, Alibaba, and Abbey
Road Studios.
Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 21
2. React Native
React Native is an open-source UI software framework created by Meta Platforms, Inc. It used to
build applications that run on both iOS and Android devices (that is, cross-platform mobile
applications) React uses HTML, CSS and JavaScript to create interactive user interfaces.

 React Native, on the other hand, uses native UI components and APIs to create mobile apps.
Mobile apps of top brands such as Tesla, Airbnb, Skype, and Amazon Prime are the best
examples of React Native apps.

 Faster development and deployment are the primary reasons behind the universal popularity
of React Native. Other notable features of React Native include reusable components,
integration with third-party plugins, and component-based GUI development for front-end
applications.

Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 22


3. Ionic framework
Ionic is an open-source framework built with Apache Cordova (PhoneGap) and Angular,
allowing developers to build Android and iOS apps for seamless mobile performance.

 The framework helps the developers build robust and feature-rich native applications.

 Ionic’s most significant advantage is that it allows the developers to use several UI
elements, such as filters, forms, views, navigation menus, and action sheets, in the
application design.

 Ionic is a complete framework that enables developers to build Progressive Web


Apps (PWAs), hybrid and cross-platform mobile applications.

Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 23


4. Xamarin
Xamarin is a Microsoft-owned open-source framework for developing native and high-
performance Android, iOS, macOS, tvOS, and watchOS apps leveraging .NET and C#
programming languages.

 The framework empowers businesses to provide native performance and unique user
experiences to end-users. In Xamarin, an abstraction layer controls the communication
between the underlying platform and shared code.

 The framework allows the developers to build an ecosystem with APIs, back-end,
components, etc., using tools, libraries, and programming languages supported by an
active community.
Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 24
5. Native Script
NativeScript is an open-source framework for building native mobile apps. As a rule, it
uses JavaScript and CSS to render the UIs and ensure native-like experience.
NativeScript attracts users with its customized tech stack that may work with Angular,
Vue. js, or TypeScript.

This open-source framework is preferred to reduce the time and code of the app loads.

Leading companies prefer Native Scripts because it has features like appropriate backend
support, business support, complete access to iOS APIs and Android, cross-platform
application, and a native user interface without web views.

Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 25


6. Apache Cordova
Apache Cordova is a framework for building mobile apps with HTML, CSS, and JavaScript.
You can target multiple platforms with one code base. It’s an open-source mobile
development framework. It is free to use, simple to set up, allows you access to device
features through plugins and the app performance is comparable to native apps as well.
Formerly known as PhoneGap, a leading mobile app development framework that is
developer-friendly.

Cordova plugins enable the developers to access device hardware capabilities such as GPS,
camera, and accelerometer to deliver a native-like app experience. Apache Cordova’s
notable features include a faster development process with a single codebase and third-party
app management tools.
Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 26
7. Framework7
Framework7 - is a free and open source framework to develop mobile, desktop or web apps
with native look and feel. It is also an indispensable prototyping tool to show working app
prototype as soon as possible in case you need to.

It allows the developers to build Android, iOS, and desktop apps with a native-like look and
feel using popular web technologies such as HTML5, JavaScript, and CSS3.

Framework7 provides additional support for Vue.js, React, and Svelte. Another attractive
feature of Framework7 is its stunning UI elements, including features such as an action sheet,
list view, popup, side panels, layout grid, and more. Framework7 makes the development
process easy, convenient, and fast.

Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 27


8. JQuery Mobile
JQuery Mobile is a user interface framework, which is built on jQuery Core and used for
developing responsive websites or applications that are accessible on mobile, tablet, and
desktop devices.

It’s a hybrid mobile app development framework that helps build platform-independent apps.
The framework uses JavaScript library and HTML to build responsive websites on various
devices such as smartphones, tablets, and desktops.

JQuery leverages the HTML5-based framework and the ThemeRoller to offer highly
customizable themes for mobile apps and web applications. JQuery Mobile comes in two
variants, namely, a customized framework and a stable version.
Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 28
9. Sencha Ext JS
Sencha Ext JS is a modern web and mobile app development framework for creating
extremely fluid, cross-platform applications. It’s the most comprehensive JavaScript
framework and is preferred by the development community to accelerate the development
of data-intensive HTML5 applications.

Developers get access to over 140 pre-integrated UI components and an array of user
extensions and tools, including, but not limited to, forms, lists, HTML5 calendars, grids,
menus, and toolbars. One of the most useful tools this application development framework
provides is ‘Sencha Architect’, which reduces time to market by allowing developers to
create HTML5 applications using its ‘drag and drop’ features.

Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 29


10. Onsen UI
Onsen UI is an open-source UI framework that makes it easy to create native-feeling
Progressive Web Apps (PWAs) and hybrid apps. It allows developers to create apps using Web
technologies like CSS, HTML5, and JavaScript. Onsen UI is: a large set of rich UI components
specifically designed for mobile apps.

Onsen UI is one of the best application development frameworks for building complex web
applications that deliver native-like experiences across platforms with the same source code.

As a modern and developer-friendly application development framework, Onsen UI provides a


great collection of UI components, such as tabs, stack navigation, and lists, that further
streamline development and accelerate time to market.

Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 30


Summary of frameworks that are widely being used for creating an app include:
Mobile App Development Framework Pros Cons
1.React Native Created by: Facebook •Ensures faster time to market •Debugging can be a challenging task
App Examples: Facebook, Instagram •Cost-effective •Slow and requires more space compared to
 Open-source, and Based on JavaScript •Facilitates code reusability its counterpart
 Works for both Android and iOS •The testing process is challenging

2.Flutter Created by: Google •Enables fast app development •Lacks integration of advanced features
App Examples: Reflectly, Google Ads •Support flexible UI (user interface) •Are large apps that require more time to
 Open-source, and Uses a single codebase •Hot reload option is available download the app
 Written in C, C++, Dart •Dart is new for developers

3.Ionic Created by: Drifty Co. •Provides intuitive interface •Performance lag on heavy applications
App Examples: Instant Pot, MarketWatch •Is cheaper to develop •Hot reloading feature is missing
 Written in JavaScript •Allows faster prototype development •Might face surety issues
 Helps develop cross-platform, hybrid, and PWA apps
4.Xamarin Created by: Microsoft •Provides multiple library support •Compatibility issues with third-party
App Examples: Azure, Alaska Airlines •Hassle-free API integration libraries and tools
 Based on .Net, c# and Open-source framework •Works well for offline apps •Offers limited access to open-source
 Helps develop applications for Android, iOS. libraries
•App size is somewhat large
5.Apache Cordova Created by: Adobe •Supports for offline apps •Does not suit hardware-reliant apps
App Examples: Wikipedia, Health Tap •Allows access to native device APIs •Hybrid apps are slower
 Open-source and Written in C#, C++, CSS, HTML, Java, •Allows code reusability •Plugins might not perform as per
JavaScript, and Objective-C expectations

Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 31


Generic UI Development
 A good User Interface (UI) focuses on making user’s interactions simple and efficient. User
would appreciate a website with intuitive user interface that leads them towards their task in
most engaging way.

 User Interface (UI) design focuses on thinking of a user, what they might need to do when they
visit website and ensure that the interface has elements that are easy to access and understand.
Being a UI designer, one need to understand the goals, skills, preferences and tendencies of the
user to make a better interface.

 The Generic User Interface (Generic UI, GUI) framework allows you to create UI screens using
Java and XML. XML is optional but it provides a declarative approach to the screen layout and
reduces the amount of code which is required for building the user interface.
Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 32
2.5. Android User
 Android is the most popular operating system in the world, with over 3.3 billion active users
spanning over 190 countries. Created by Andy Rubin as the open-source alternative to iPhone
and Palm OS, Android quickly became the favorite operating system for most mobile
manufacturers in the early 2010s. With titans of the industry such as Samsung, LG, Motorola
and HTC all launching phones running Android, it quickly became the most popular mobile
OS, hitting over one billion active users by 2014.

 Android has added more users every year since inception. Even though in more mature
markets user growth has stagnated, Android has continued to grow at a remarkable rate through
its popularity in developing countries. In Brazil, India, Indonesia, Turkey and Vietnam,
Android has over 85 percent market share.

Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 33


Cont..

 User interface (UI) design is the process designers use to build interfaces in software or
computerized devices, focusing on looks or style.

 Designers aim to create interfaces which users find easy to use and pleasurable. UI design refers to
graphical user interfaces and other forms—e.g., voice-controlled interfaces.
Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 34
Cont..
User interfaces are the access points where users interact with designs. They come in three
formats:

 Graphical user interfaces (GUIs) - Users interact with visual representations on digital control
panels. A computer’s desktop is a GUI.

 Voice-controlled interfaces (VUIs) - Users interact with these through their voices. Most smart
assistants—e.g., Siri on iPhone and Alexa on Amazon devices—are VUIs.

 Gesture-based interfaces - Users engage with 3D design spaces through bodily motions:

e.g., in virtual reality (VR) games.

Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 35


Cont..

A user interface can be judged by three main properties:

 Ease-of-use; how easy it is to use a certain user interface

 Efficiency for inputting information; how fast information can be input through the user
interface.

 Efficiency for outputting information; how fast the user can process the information coming
back from the system

Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 36


2.6. VUIs and Mobile Apps, Text-to-Speech Technique

 Voice user interfaces are user interfaces that are used through speech. Typical
examples of voice user interfaces include smart speakers and voice assistants.

 Voice UIs employ speech recognition and natural language understanding technologies
to transform user speech into text and meaning. Speech is a tool for enhancing
traditional touch user interfaces into multimodal voice user interfaces.

 Voice user interfaces are highly intuitive as they use the most natural way for us to
communicate: speech. They are significantly faster than typing to input information but
significantly slower than reading or seeing to output information from the computer
system back to the user.

Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 37


Cont..
 The first voice user interfaces were IVR, Interactive Voice Response, systems that enabled
users to interact with a phone system by using speech. Typically, IVRs recognized only
digits, but nonetheless they were early voice user interfaces.

 The first applications of voice UIs were interactive voice response (IVR) systems that came into
existence already back in the 80s. These were systems that understood simple commands through a
telephone call and were used to improve efficiency in call centers.
Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 38
Cont..
 Current voice user interfaces can be a lot smarter and can understand complex sentences and
even combinations of them.

 For example, Google Assistant is perfectly fine with something like “Turn off the living
room light and turn on the kitchen light”.

 However, as these smart speakers always wait until the end of the user utterance and only
then process the information and act accordingly, they will fail if the user hesitates with their
speech or says something wrong.

 For instance, you can try something like “Turn off the kitchen light, turn on the living room
TV, turn on the bedroom and terrace lights and turn off the radio in the kitchen.”
Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 39
2.7. Designing the Right UI
 In mobile app development, the UI (user interface) and UX (user experience) play the most
significant roles in a mobile app’s success. From the perspective of a designer, an exceptional
UI for mobile app can only be ensured when you follow some tried and tested UI design
principles. It is always advisable to stick to certain principles that are accepted by the designers’
community.

The UI principles:

1. Consistency of the design layout: Different sections of the app must be coherent in the design,
and there must be a consistent flow of the layout throughout the app. Apps like Evernote, Netflix,
and Dropbox deliver great consistency in their design layout. This also applies to the common
features of the apps built for the same OS.

Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 40


UI principles
2. Unambiguous Interactive Elements: The design elements that are interactive in nature must be
clearly depicted. Ambiguity should be avoided to make sure that the users are going to access such
elements when required by them. Options hidden in menus may sometime be forgotten. Several
surveys and studies have revealed that conspicuous menu options are not good for mobile apps. At
least, the key navigation elements must be visible.

3. Single Trial Learning Experience: The term ‘Intuitive’ is often used to describe mobile apps
when suggesting that they are very user-friendly. Actually, this word means that users understand
the flow of the app without remembering the steps. Options should be placed in a manner where
users can infer what the next step would be.

Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 41


UI principles
4. Anticipate and Answer Users’ Queries: When a user’s tap a button, they want to know whether the
process has started and how long will it take. As technology abstracts these actions, the users are
usually kept in the dark while the process is going on. Use Toast in Android and notifications in iOS so
users will be notified when a process has completed. The Gmail app is a good example of such a
design, as it displays messages like “saved in draft, message sent, etc.” to inform the users about the
completion of the task.

5. Layered User Experience: The UX should be layered. Layered here refers that all the features of an
app must not be exposed at once. It should surface out as the users delve deeper into the app and
discover new things. This would help in keeping the users’ interest intact for a longer
time. WhatsApp offers a good layered experience as users explore new features as they go deeper into
the app.
Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 42
Design an interface for a mobile app

1. Uniqueness - There is no point in creating something that already exists, and it is the same
with mobile app design. Uniqueness is one of the most important mobile design principles and
that is why it stays on the first place in our list.
Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 43
Cont..

2. Structure

 User interfaces for mobile applications should be organized in such a way that users will
find it helpful and meaningful.

 Make sure similar items are grouped together and users won’t spend tons of time trying to
find what they need. You also need to keep in mind that the number of features and
sections should not overwhelm the user, so be ready to sacrifice some less relevant
features.

Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 44


Cont..
3. Contexts

 Some apps can be used only on the go, others can be used in a relaxed atmosphere, and some
apps can be used in both situations.

 Context seriously affects mobile user interface design, such as a bigger font, highlighted
buttons, and only vital content. On the other hand, the interface can be entertaining and full of
engaging options. Before moving on, you need to find out in what context your app will be
used and then build the interface according to this information.

Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 45


Cont..

4. Gestures
 Gestures allow users to navigate apps intuitively. Gestures can also add some gamification and
may help you gain particular audiences, like teenagers.

 Mobile devices are designed for gestures, so try to get the most out of it and become a source of
inspiration for other apps. Simultaneously, try use gestures that are familiar to your users and
keep in mind how your users will be handling their device and in what context.

 Let’s say if the user is holding the handrail on a public transport with one hand and trying to
work an app with the other hand, it might be annoying if there are no other gestures but to pinch
to expand, since this gesture requires two hands.
Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 46
Cont..

5. Tolerance
 App interface design should be created in a way that if some options come up along the
way, the system would suggest by default such variants that will be most beneficial to the
user.

 Make sure your app allows users to undo certain actions and there are notifications showing
that some changes will be made and can be undone.

 Tolerance means allowing users to make mistakes and giving them the opportunity to
revoke changes.

Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 47


Cont..

6. Consistency
 If there are several elements serving one and the same purpose in the app, they should look
and function the same way. No exceptions. Changing one element means changing all other
variants. If there are several styles of “submit” buttons on different pages, it can be frustrating
and the app would look messy.

 Consistency means tidiness and it is certainly a must-have in every app, which is why in the
majority of mobile app design companies there’s a rule to create a UI kit for every project.
This includes all elements of the app, and it becomes easier to follow the consistency
principle with a UI kit.

Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 48


Cont..
7. Communication
 The core idea here is to let users know your app registered the action and processing it even if it is
not possible to give an immediate result. When the user performs a certain action, it can be
considered an act of communication with your app, which is why the app should respond with
something.

 From a psychological perspective, people need to get acknowledgment for their actions, and it is
especially important in the banking sphere.

Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 49


Thank You!

Chapter Two Mobile Application Development IT compiled by: Birhanu G. 4/28/2023 50

You might also like