Developing Web Based ASSESSMENT

02
Mobile Applications

MR.BIMSARA

THARUSHINI PERERA
18s07011
Assessment Task 2
After winning the account, you have now been awarded the project of producing design documentation
and digitally designed elements for use within a web based mobile application suitable for the proposed
device for the local medical establishment. You will agree a scope (choice of device, platform, what the
app will do, how it will do it and what the app will not do or allow regarding push notifications, etc. user
expectations and a workable schedule) with your client (your lecturer). You will create and produce the
design documentation within the pre-agreed timescale.
The design documentation and scope will include the following:
• User requirements and expectations.
• Platform restraints.
• Design aspects for a specific target device.
• A navigational map.
• Storyboard demonstrating interaction.
• Paper mock-up demonstrating navigation and several screen layouts.
• Screen layouts, including any variations for orientation and size.
• Design of a workable User interface.
• A list of features - sound, media, push notifications, etc.
• Design of Icons for use within the application.
• Effective use of color.
• Cogent use of typography.
• Design of legible graphical elements (orientation and size).

You should consider the development stages of the application and the agreed scope — is the technical
capable of the scope? Are milestones set and agreed upon? What consideration to storage and hosting
has been researched and agreed? What support, maintenance and updates have been addressed?
User requirements and expectations

Functional Requirements
 User management
 Display carbohydrate values using the database
 Users should be able to chat with each other (eg:- group chat )
 Micro blog

Non functional Requirements

 Portability
 Reliability
 Ease of Use
 Speed
 Size
 Privacy

Platform restraints.
Design aspects for a specific target device

There are three major ways target mobile devices. Which are,
 Checking user agent server side.
 Checking user agent client side.
 Use CSS media type.
A navigational map

Sign in
HOME

Login Login HOME

Calculate
Carbohydrate Contact
Storyboard demonstrating interaction.

Using a storyboard can be always useful because it can illustrate what our product will output and
where is our product going, even we can clearly identify the goals of our Mobile application. Even
developers can show storyboard to the clients and can get their feedback so there important parts can
be recognized. although how hard developers working on a product can be useless if they cannot full
fill the customer, so doing a storyboard can prevent those kind of damages to a software company.

Paper mock-up demonstrating navigation and several layer layout.

Typically mid to high fidelity, mockups reflect the design choices for color schemes, layouts,
typography, iconography, the visuals of navigation, and the overall atmosphere of the product.

In addition to setting aside time to answer the important visual questions, mockups have several
other benefits:

 Intuitive to stakeholders — Thanks to their higher fidelity, mockups require less context than
lo-fi documents like wireframes. Stakeholders can more easily see the final product.
  Realistic perspective — It’s one thing to have all your visual decisions made, but it’s another
to see them all working together in a way close to the real thing. Mockups can help reveal
problems that aren’t so apparent on paper (for example, color clashes, or smaller type crimes
going unnoticed).

 Early revisions — It’s easier to make revisions in a mockup than in the later coding stages (as
long as the mockup itself isn’t coded).

In the design process, mockups come at the end of the lo-fi phase and the beginning of the hi-fi
phase. This could mean different things for different methods — for example, a mockup could be
made immediately after wireframing, or could be postponed until after some lo-fi prototype testing.

We also recommend testing when transitioning from lo-fi to hi-fi, however. Big picture concepts like
navigation and flow are harder to change in high fidelity, and so should be iterated before you dive
into a hi-fi mockup.
Screen layouts, including any variation for orientation and size.

Design for a workable user interface.

In this mobile app there is workable and user friendly interface in any of forms. For a example,
(home page)

References:
https://www.uxpin.com/studio/blog/what-is-a-mockup-the-final-layer-of-ui-design/