"BYG EN APP - SPORTSAPP"

A project designed by Emma Blæsbjerg

Assignment Description

In the project for this flow, you will design and create a prototype for a mobile app. You choose the type of device / smartphone and tablet you are developing as well as the operating system.

The app should be a solution to one of the three problems below. You want to use Adobe XD to demonstrate screens in the app and their flow as well as use Adobe Illustrator for graphics to the interface and Adobe Photoshop for images.

Select one of the following topics for project:

• Weather app
• Home Search app,
• Sporttracking app

The assignment must develop in collaboration with others in joint development and data collection as well as development of graphics and graphics. Men's final prototype delivery must be unique and individual.

The app should be developed for both mobile and tablet and there should be at least 3 menu items and at least 3 levels. Content must be sufficient for user testing to be carried out but generic content and prosatekst may be placeholder.

Develop interface gadget elements including icons for the app, all drawn in Adobe Illustrator.

Abilities gained

These are the abilities gained doning the assigment

  • Basic skills in working with vector graphics
  • TKnowledge about graphics and icons for digital interfaces
  • Knowledge about colors and color systems
  • Knowledge about typography
  • Knowledge of design principles in layout of digital interfaces
  • Knowledge of user test
  • Knowledge about data collection

The process

Online solution Smartphone - Tablet

process

For this purpose, I intend to document the development of the prototype, as well as describe the choices I have taken, for example. design, layout, etc.
It describes how the task is tackled in terms of solutions.
The process is documented in Danish.

Link: Development

Feedback

Very nice task with all the right things included.
A good documentation that shows the progress and process of what you have made and a really good layout. Very nice description and demonstration of your icons as well.

The screen size layout is also great as there is no one who prints them longer. All documentation is right in the closet and is well executed and that is exactly what a task should be done.

The visual impression is raw and hard, which is somewhat more unusual than the other episodes, so it's a positive change.
The navigation in the app is super good and there is a great depth and content to show that is very convincing.
The icons are good, but the buttons through the app are very different. Some square, some rounded squares. They are otherwise red, but make sure the buttons in the app have a recognizable feature throughout the process. Really good work

Redesign

Link Online solution

Items to be changed in the app:

- The icons: same layout
- Buttons: Same format (round / square)?
- Menu icons: set straight
- Bottom navigation: remove unnecessary icons
- "Program": remove color from images + 2 bottom images
- Text: Generally throughout the app
- Colors: same theme on all buttons

The purpose of redesigning my app was based on user test, as well as comments made during submission. All comments made by user run out that they thought the app works well and that the layout theme is appropriate and implemented.
The only thing most people agreed was that the menu icons should be the same as well as standing on the side. In addition, many thought that all buttons that could be printed on should be the same in layout and color. Lastly, unnecessary buttons should be removed and information that had no function.

Therefore, in my redesign of the app, I do not change the size of the app, only the small things that had been mentioned. The menu buttons have been changed, as now everyone has been drawn, so nobody is filled, and they are set in row of three and two.
Additionally, buttons and information that were not necessary have been removed - button at the bottom which no function had been removed, as well as the pictures on unpinable programs.

Eventually, I changed all printable buttons, to be round in the edge, as well as white and with a red text. The colors were changed from red to white on the buttons as users thought it gave some light to the otherwise dark app.