User Interface Design Concepts

User Interface Design COMP-1650
1 | P a g e
Submission date – 7nd
November, 2017
User Interface Design
Comp - 1650

2 | P a g e
Table of Contents
1. Acknowledgement ......................................................................................................................... 3
2. Introduction ................................................................................................................................... 4
3. Guidelines and standards ............................................................................................................. 5
3.1. Selected rules from Shneiderman`s Eight Golden Rules ................................................... 5
3.2. Selected rules from Nielsen `s Usability Heuristics............................................................ 8
3.3. Selected Android UI Design Guidelines .................................................................... 11
4. Justifying required interface design concepts ................................................................... 13
4.1. Color Theory .................................................................................................................... 13
4.2. Font Terminology ............................................................................................................. 16
4.3. Layout............................................................................................................................... 20
4.4. Graphic design elements................................................................................................... 24
5. Issues ............................................................................................................................................ 27
5.1. User interface design issues of the software running on different devices ...................... 27
5.2. Legal, social and ethical issues......................................................................................... 31
5.3. Suggestion for all issues ................................................................................................... 31
6. Designing low-level prototype ............................................................................................... 32
6.1. Facts about this application .......................................................................................... 32
6.2. Defining target users......................................................................................................... 32
6.3. How prototypes are created according to interface design concepts ...................... 32
6.4. Design concepts for prototypes ........................................................................................ 36
6.5. Evaluation for two prototypes ..................................................................................... 37
6.6. Cognitive walkthrough ................................................................................................. 53
6.7. Evaluation with GOMS model .................................................................................... 57
7. Proof of concepts ......................................................................................................................... 59
8. References..................................................................................................................................... 61

3 | P a g e
1. Acknowledgement
I would like to give my thanks and appreciation to my teachers from KMD Institute,
Mrs.Moe Pale and Mrs.Sander Lwin. It is very helpful for me to accomplish this coursework
because their teaching methods and guidelines are very effective for every student. I also
appreciate to all responsible staffs at our campus, KMD. I also would like to thanks my parents for
their supporting.

4 | P a g e
2. Introduction
To improve personalized experience of current students around the university, an
application must be developed. This coursework will document about low-level UI prototype and
the discussion on various design theories, concepts and issues.

5 | P a g e
3. Guidelines and Standards
In this report, respective rules chosen from Shneiderman and Nielsen will be used because
latest UI designs or guidelines from leading tech organizations like Apple and Google are fit with
those rules. Suitable android guidelines will also be used.
3.1 Selected rules from Shneiderman`s Eight Golden Rules
Selected rules are as follow.
Strive for Consistency
Things like icons, fonts, etc. should be used to every users and functions must also become
familiar with users once after they access system.
Figure.3.1.1 – All icons, functions and terms can be understood by most user levels.
(Source: https://www.yale.edu/ )
Figure.3.1.2 – Understandable functions, words and design components for most user-levels.
(Source: https://www.cam.ac.uk/)
Offer informative feedback
Depending on client`s actions, appropriate feedbacks must be clearly given in time to
inform users what system is currently providing and where they can navigate next.

6 | P a g e
Figure.3.1.3 (Source: https://www.umd.edu/information-visitors-parents-and-families )
Figure.3.1.4 (Source: http://www.graduate.study.cam.ac.uk/colleges )
Design dialog to yield closure
After users finish accessing a feature or more, system must report them what is completed
or what can be continued next so that users can see processes in an organized structure.
Feedback to users
that system is
processing user
request.
There are two
indications of
current
arriving
section and
associated
pages.

7 | P a g e
Figure.3.1.5 – After signing up for newsletter, this system notify user that requested process is
complete.
(Source: https://apply.globalscholars.yale.edu/register/moreinformation?cmd=submit )
Supporting internal locus of control
By completing what users expected from system, it will be more personalized for users to
believe that they can fully control the system.
Figure.3.1.6 – (Source: https://maps.umd.edu/map/ )
This web contains a map system with various
features like drawing tools, undo/redo, search
and so on that can be controlled by users.

8 | P a g e
3.2 Selected rules from Nielsen `s Usability Heuristics
Selected rules are described below.
Error prevention
Other than using error messages after user makes mistake, there should be pre-operations
to make sure user won`t face errors.
Figure.3.2.1 (Source: https://apply.graduate.study.cam.ac.uk/applicant/register )
Aesthetic and minimalist design
Design needs to get user attentions by simplifying user focusing areas.
Password rules and strength is shown to
users to protect errors like security
issues.

9 | P a g e
Figure.3.2.2 – Home page is simply designed with clear logo position, visible navigation bar,
enough whitespaces between contents. (Source: https://www.harvard.edu/ )
Help users recognize, diagnose and recover from errors
Via notifications, users need to know clearly what error is, why it happens and how they
can fix.
Figure.3.2.3 (Source: https://apply.globalscholars.yale.edu/register/moreinformation
Error is alerted via
both highlighting
and pop-ups.

10 | P a g e
Help and Documentation
If clients need help with accessing system, user manual should be supported to learn
through the system.
Figure.3.2.4 – User guide for campus map system
(Source: https://maps.umd.edu/map/help.html )

11 | P a g e
3.3 Selected Android UI Design Guidelines
Rules described below are selected.
Real objects are more fun than buttons and menus
Rather than using buttons or links simply, displaying them with icons which can directly
describe user actions is more meaningful.
Figure.3.3.1 – Facebook`s android app
Only show what I need when I need it
Based on what user really need, system must only show related features primarily and hide
unnecessary features.
Exit door icon
for logging out

12 | P a g e
Figure.3.3.2 – Sony`s android album app shows selected photo quantities and two most-used
features – delete and share when user selects photos.

13 | P a g e
4. Justifying required interface design concepts
4.1 Color Theory
Colors can point out different meaning and more meaningful than using words sometimes.
Color theory is used for choosing or mixing suitable colors based on color wheel (Figure.4.1.1).
Figure.4.1.1 – Color wheel formation with its three categories
(Source: https://www.gcflearnfree.org/beginning-graphic-design/color/1/ )
Below, examples are provided for about colors in university websites. (See Figure.4.1.2,
4.1.3, 4.1.4 and 4.1.5)

14 | P a g e
Figure.4.1.2 (Source: https://www.cam.ac.uk/ )
System in Figure.4.1.2 has color scheme (blue for buttons/links and yellow for
headlines). That scheme is selected via complementary formula (Figure.4.1.3) selecting colors
oppositely existed on color wheel.
Figure.4.1.3 (Source: https://www.gcflearnfree.org/beginning-graphic-design/color/1/ )
blue
yellow

15 | P a g e
Figure.4.1.4 (Source: https://www.stanford.edu/ )
System in Figure.4.1.4 has one main color (red). It is chosen via monochromatic formula
(Figure.4.1.5) in which chosen color is varied with saturation and brightness.
Figure.4.1.5 (Source: https://www.gcflearnfree.org/beginning-graphic-design/color/1/ )
red
Reduced
brightness of
red color

16 | P a g e
4.2 Font Terminology
Font terminology is beneficial for supporting user readability and attraction. There are two
main font groups – “Sans Serif” and “Serif” (See Figure.4.2.1).
Figure.4.2.1 – Difference between two main font families
(Source: https://designschool.canva.com/blog/typography-terms/ )
Two important additional font families are “Display” which is for big headlines and
“Script” which is hand-written style. Differences between four important font families is shown
in Figure.4.2.2. Various font designs are decorated by using elements shown in Figure.4.2.3.

17 | P a g e
Figure.4.2.2 – (Source: https://designschool.canva.com/font-design/ )

18 | P a g e
Figure.4.2.3 – Anatomy of designing fonts
(Source: https://designschool.canva.com/blog/typography-terms/ )
Commonly used fonts in university applications are shown below. (Figure.4.2.4 and
4.2.5)

19 | P a g e
Figure.4.2.4 – Appropriate bolding and spacing to all fonts are applied.
(Source: https://www.umd.edu/ )
Figure.4.2.5 – This has also the same font design approach like previous one.
(Source: https://www.yale.edu/ )
“Serif”
“Sans
Serif”
“Serif”
“Sans
Serif”
Bold
header
Bold
header

20 | P a g e
4.3 Layout
Layout is created by utilizing grids (rows, columns, whitespaces and margins) to
systematically position UI contents.
Figure.4.3.1 – Large/medium device layout
(Source: https://webdesign.tutsplus.com/articles/a-beginners-guide-to-wireframing--webdesign-
7399 )

21 | P a g e
Figure.4.3.2 – This system has similar layout shown in Figure.4.3.1.

22 | P a g e
Figure.4.3.3 – Tablet layout recommended by Android guidelines
(Source: https://material.io/guidelines/layout/structure.html#structure-ui-regions)
Figure.4.3.4 – YouTube`s layout follows the structure shown in Figure.4.3.3.

23 | P a g e
Figure.4.3.5 – Mobile layout
(Source:http://magazine3.com/blog/how-to-make-wordpress-website-optimized-for-mobile-
devices/ )
Figure.4.3.6 – This mobile layout is similarly built in row-by-row like above one.
(Source: https://www.stanford.edu/ )

24 | P a g e
4.4 Graphic Design Elements
Essential components of a UI design are graphic design elements – Line, Shape, Space,
Size, Texture and so on.
a) Line
Line is useful for multi-purpose like dividing contents, text underline, etc.
Figure.4.4(a).1 – Vertical/horizontal lines separate articles to support visibility.
(Source: https://www.ucl.ac.uk/ )
b) Shape
Shapes (Geometric figures, icons) can bold important parts like buttons, image borders,
etc.

25 | P a g e
Figure.4.4(b).1 – Shapes of graphic design elements in a system
(Source: https://www.stanford.edu/ )
Figure.4.4(b).2 – Standard icon designs recommended by Google
(Source: https://material.io/icons/ )
c) Space
To make UI contents neat and clear look, keeping spaces play the role.
Standard hamburger
slider-menu
Search icon
Rectangle button
Circle image
border

26 | P a g e
Figure.4.4(c).1 (Source: https://www.stanford.edu/ )
d) Size
Size of elements like text, images, etc. should be suitable to get user focus.
Figure.4.4(d).1 – Usual content sizes (Source: https://www.harvard.edu/ )
Whitespaces
between
headlines and
contents
Noticeable
Logo size
Visible header with
full-sized background
Normally sized
link-buttons

27 | P a g e
5. Issues
5.1 User interface design issues of the software running on different devices
Because of the popularity of smart devices, software UIs have been developed for
numerous devices and related issues become.
a) Responsive design issues
Layout
Responsive design relies on layout which limit developers to freely design. So,
prototyping period is strongly required.
Incompatibility with old system
As responsive design is updated design method, it has problems with old system.
E.g. responsive design takes longer responding time in outdated devices.
b) Adaptive design issues
breakpoint issues
Adaptive layout responds to each screen at defined resolution breakpoints. If layout
cannot support newer resolutions, it can be a problem with updated resolutions.
Issues during development
Because of developing multiple screens, adaptive design causes longer
development duration, complexity and more budget usage.
c) Other associated issues
Inconsistent navigation
Complex navigation system can confuse users what they need to continue or which
they are accessing. Unfamiliar terms also force users reluctant to keep using system. (See
Figure.5.1(c).1 and 5.1(c).2)

28 | P a g e
Small device Medium device
Figure.5.1(c).1 – Non-
standard mobile
navigation
Figure.5.1(c).2 – Inconsistent navigation on large/medium
devices
Inappropriate content sizes
Inappropriate content sizes are problems for all resolutions. Keeping logos and
main headers in tiny size will fail to catch user focus.
Tiny or over-sized fonts can cause bad readability on almost all devices.
Small call-to-action buttons/links are also difficult to see in large/medium devices
or can be touched or swiped mistakenly on mobile/tablet. (See Figure.5.1(c).3)
Figure.5.1(c).3 – Unreliable small links

29 | P a g e
Content positioning
Showing overload number of contents without whitespaces and alignment forces
user to see system as a complicated one. Showing many contents at a place make small
device users to feel uncomfortable to scroll down the apps like endlessly. (See
Figure.5.1(c).4 and 5.1(c).5) Keeping many input boxes in a single place is also problem
for mobile view. (See Figure.5.1(c).6)
Small device Medium device
Figure.5.1(c).4 – Need
excessive scroll on
mobile
Figure.5.1(c).5
(Source: www.pixabay.com )

30 | P a g e
Figure.5.1(c).6 – Many input forms make mobile`s on-screen keyboard to cover up them.
Performance reducing
Over using of images, animations and 3rd
party tools for designing purpose waste
system performances, internet data usage and battery usage.

31 | P a g e
5.2 Social, legal and ethical issues
Social Issues
Later, people are relying more on unofficial information from social medias rather than
official sources. Number of tablet users are lower than mobile/laptop/desktop users so that
deployment of tablet-based applications can face difficulty. For Operating systems, there are more
android users than Apple, Microsoft and others. In Myanmar, universities are still struggling to
provide technical support like tablets or PCs to students.
Legal Issues
Unauthorized personals can illegally modify/distribute software or even this prototype so
that copyright must be claimed by university. Things like images, logos, etc. contained in system
must not interfere with other ownerships. Security issues like phishing attack, etc. are also illegal
cases. When university or government policies change, update patches should be released to fix
old information.
Ethical Issues
System should be developed for Not only tablet users but also other device users. User
experience for people with disabilities (e.g. color-blind person) must be considered. If not, this
system cannot offer equally standard experience to all users. User privacy problems can happen
too. For instance, corrupt system admins can obtain easily to misuse information like student
personal facts.
5.3 Suggestion for all issues
For responsive and adaptive issues, creating responsive design can make development
processes more effortless, duration is shorter and maintenance is easier. To support many device
variants, responsive design is more suitable than adaptive which need to change its content
depending on each device.
For other related issues, they can be maintained if design can follow the usability and UX
principles thoroughly. Analyzing on user feedbacks is also a good way to cover those issues.
Another way is to only show features that user will access daily and hide those unnecessary.

32 | P a g e
6. Designing low-level prototype
6.1. Facts about this application
▪ This application will be developed mainly for current students to use within Shane
University in Yangon, Myanmar.
▪ Presently, it is only designed for android tablets.
▪ It needs internet connection.
▪ It will offer features to help users to know information about this university.
6.2. Defining target users
Primary users Secondary users
Current students Others like parents and guests
Age Between 17 and 21 Between 23 and 60
Why they use? - Want to try it for the first time
- To search about news, events,
services and locations
- They will use this app like
the purpose of students but
rarely.
6.3. How prototypes are created according to interface design concepts
Prototype 1 Prototype 2
Color Main color is red and varied in some
places due to brightness and saturation.
Main color is blue and varied in some
places due to brightness and
saturation.
Font Arial Times New Roman
Layout

33 | P a g e
Graphic
design
elements
Lines, whitespaces, shapes (Rectangle
and circle) and Android material design
icons are used.
Whitespaces and shapes (Rectangle
and circle) are used.

34 | P a g e
Prototype 1
Figure.6.3.1 – Home screen
Figure.6.3.2 – Campus map

35 | P a g e
Prototype 2
Figure.6.3.3 – Home page
Figure.6.3.4 – Campus map

36 | P a g e
6.4. Design concepts for prototypes
Home
Map
About
News
News detail
Events
Event detail
Help

37 | P a g e
6.5. Evaluation for two prototypes
To pick the best one out of two prototypes, Usability and UX principles will be used for
heuristic evaluation.
Shneiderman`s Rules
Strive for Consistency
Prototype-1 Prototype-2
Main navigation bar`s functions
are familiar to most users and
shown with understandable
words and icons. Font and color
are clear for user`s sight.
Main navigation bar`s functions are familiar to most users
and shown with understandable words. Font style is a little
hard to read suddenly.
Rating – 1.2.3.4.5 Rating – 1.2.3.4.5
Offer informative feedback
Because of slider menu, user have
to open navigation to see indication
Fixed navigation bar at the top makes users to see easily
which tab he is using now.

38 | P a g e
about which part he is currently
accessing.
Rating – 1.2.3.4.5 Rating – 1.2.3.4.5
Design dialog to yield closure
After user found a location, final
result is displayed with location
details and how user can go there.
Final result about location given by prototype-2 is
only on map and details won`t be included.
Rating – 1.2.3.4.5 Rating – 1.2.3.4.5
Supporting internal locus of control
This button will make system to behave as a
guide to user`s desired location.
This button makes system to show where user
is currently arriving.

39 | P a g e
This button makes system to point out where
user is currently arriving.
Rating – 1.2.3.4.5 Rating – 1.2.3.4.5
Nielsen`s Rules
Error prevention
To prevent searching error because of wrong
spelling, system will underline that spelling and
provide more related suggestion below.
Prototype-2`s search will only show
results after user input. Auto correction
and suggestion won`t be provided.
User can face incorrect results.
Rating – 1.2.3.4.5 Rating – 1.2.3.4.5

40 | P a g e
Aesthetic and minimalist design
Both prototypes are simply designed by placing visible logo and navigation units,
whitespaces between contents and leaving unnecessary contents. (See Figure.6.3.1, 6.3.2, 6.3.3
and 6.3.4)
Rating for both prototypes – 1.2.3.4.5
Help users recognize, diagnose and recover from errors
When user makes wrong searching, error
message is show with red line and nearly
related keywords is suggested. So, user can
know how to fix.
Prototype-2 offers the same as prototype-1.
Rating – 1.2.3.4.5 Rating – 1.2.3.4.5

41 | P a g e
Help and Documentation
In help option, user can find how to use
this app, important phone numbers and
check app updates.
Prototype-2 also contains help features like
prototype-1.
Rating – 1.2.3.4.5 Rating – 1.2.3.4.5
Total overall rating of prototype-1 is 39 and prototype-2 is 35. Hence, prototype-1 is
recommended as the best one that is acceptable by perspectives of design and usability. Selected
prototype will be evaluated with two more inspections – Cognitive Walkthrough and GOMS.

42 | P a g e
Final prototype will be as follow.
Figure.6.5.1 – About page

43 | P a g e
Figure.6.5.2 – Home page

44 | P a g e
Figure.6.5.3 – event page

45 | P a g e
Figure.6.5.4 – event detail page

46 | P a g e
Figure.6.5.5 – news page

47 | P a g e
Figure.6.5.6 – About page

48 | P a g e
Figure.6.5.7 – map page

49 | P a g e
Figure.6.5.8 – How user makes search

50 | P a g e
Figure.6.5.9 – search result page

51 | P a g e
Figure.6.5.10 – When no result found

52 | P a g e
Figure.6.5.11 – Help page

53 | P a g e
6.6. Cognitive walkthrough
Two important features will be examined for their usability. 5 users (students) will
participate in this test.
Feature-1 (User want to search a location)
User will follow steps below
▪ Open the application
▪ Click from navigation menu
▪ Type desired location in this
(or)
select categories from this to be more specific
▪ Searched location will be shown on map along with location`s details. Then, user
will click to get directions and related info like duration and
distance
Outcomes
Student 1
Questions 1st
action 2nd
action 3rd
action 4th
action
Will user accomplish? Yes Yes Yes Yes
Does user confuse with
other features?
No No No No
Does user need help? No No No No
Are features visible to user? Yes Yes Yes Yes
Student 2
Questions 1st
action 2nd
action 3rd
action 4th
action
other features?
No No No No

54 | P a g e
Does user need help? No No No No
Student 3
Questions 1st
action 2nd
action 3rd
action 4th
action
other features?
No No No No
Does user need help? No Yes Yes Yes
Are features visible to user? Yes No Yes Yes
Student 4
Questions 1st
action 2nd
action 3rd
action 4th
action
other features?
No No Yes No
Does user need help? No No Yes No
Student 5
Questions 1st
action 2nd
action 3rd
action 4th
action
other features?
No No Yes No
Does user need help? No No Yes Yes
Are features visible to user? Yes Yes Yes No
Final verdicts
Questions 1st
action 2nd
action 3rd
action 4th
action
Users accomplished All All All All
Not accomplished
Users confuse with other
features
3 students
Not confuse All All 2 students All
User needs help 1 student 3 students 1 student

55 | P a g e
No need to help All 4 students 2 students 4 students
Users can see features visibly All 4 students All All
Not visible 1 students
Usability status Good Good Good Good
Feature-2 (User want to read latest news)
User will do phases below
▪ Open application
▪ Click
(or)
Click to view news section
▪ In news page, user will find desired one and tap on it to read
Outcomes
Student 1
Questions 1st
action 2nd
action 3rd
action
Will user accomplish? Yes Yes Yes
other features?
No No No
Does user need help? No No No
Are features visible to user? Yes Yes Yes
Student 2
Questions 1st
action 2nd
action 3rd
action
other features?
No No No
Are features visible to user? Yes No Yes
Student 3

56 | P a g e
Questions 1st
action 2nd
action 3rd
action
other features?
No Yes No
Does user need help? No Yes No
Are features visible to user? Yes No Yes
Student 4
Questions 1st
action 2nd
action 3rd
action
other features?
No No No
Student 5
Questions 1st
action 2nd
action 3rd
action
other features?
No No No
Final verdicts
Questions 1st
action 2nd
action 3rd
action
Users accomplished All All All
Not accomplished
Users confuse with other
features
1 student
Not confuse All 4 students All
User needs help 1 student
No need to help All 4 students All
Users can see features visibly All 3 students All
Not visible 2 students

57 | P a g e
Usability status Good Good Good
6.7. Evaluation with GOMS model
Feature, searching events, will be evaluated as follow.
Goals
A student will use this app to know about upcoming events.
Methods
Two methods are available
1. Using search feature
2. Searching through event page
Operators
Operator steps can vary depending on user`s experience, typing speed, internet
connection and device performance.
For method.1,
No. Steps Duration (seconds)
1. Open app 2s
2. Tap on search box 1s
3. Start typing 3s
4. Click search icon or click enter from keyboard 1s
5. Find the right one from search results 4s
6. Click on right one 1s
7. Wait to see full event details 1.5s
Total – 14s
For method.2,
No. Steps Duration (seconds)
1. Open app 2s
2. Click on Event button from navigation 1s
3. Find desired event from event list 8s
4. Click on right one 1s
5. Wait for loading to complete for showing details 1.5s

58 | P a g e
Total – 14s
Selection
Both methods have same duration because most users want to know about latest events.
Latest events are always shown as a priority so that users can find easily.
Method.1 is more suitable for specific finding.
Method.2 is good when user just want to check overall event list.

59 | P a g e
7. Proof of concept
Knowledge from this documentation
We learnt well about the design principles, theories and common issues through this
documentation. After systematically analyzing them, prototype development processes become
smooth and almost all issues described above becomes no concerns for our prototype. By
discussing several issue variants, we can learn that considering about issues for one device is not
enough and issues can also link to environmental and social impact. Because of usability and UX
principles, two prototypes were successfully created and detail comparison between those two
designs brought the right design to us. Color theory also point out that even using one color with
appropriate brightness and saturation can lead to standard design. Evaluating about fonts and
layouts are very supportive in analyzing various real-world design samples. We also got
knowledge that material designs by google is vital in latest design influences.
Future development
For first phase, updates will roll out for this design and features. Because of low-level
prototype only designed for tablets, problems may interfere in real development when app need to
run on mobile and other devices because coding duration can take more time. So, design for other
resolutions will be built in first phase alongside with additional features which can support students
like online e-library and so on.
Figure.7.1. Low-level prototype for mobile
Secondly, it comes to operating systems. This prototype is only for android and there are
other users like apple`s iOS and Microsoft windows. This design should support for all OS in
future.

60 | P a g e
Lastly, prototype is still low-level and it only passed paper testing. Hence, it is more
effective by testing this app with beta version in order to inspect in details how much students’
daily lives are improved with this app.

61 | P a g e
8. References
Studio by UXPin, (2017). Responsive vs. Adaptive Design: What’s the Best Choice?. [online]
Available at: https://www.uxpin.com/studio/blog/responsive-vs-adaptive-design-whats-best-
choice-designers/ [Accessed 4th
November. 2017]
GCFLearnFree.org, (2017). Beginning Graphic Design: Color - Full Page. [online] Available at:
https://www.gcflearnfree.org/beginning-graphic-design/color/1/ [Accessed 4th
November. 2017]
Web Design Envato Tuts+, (2017) Less is More: Fundamentals of Minimalist Web Design.
[online] Available at: https://webdesign.tutsplus.com/articles/less-is-more-fundamentals-of-
minimalist-web-design--webdesign-8 [Accessed 4th
November. 2017]
Design School, (2017) Font Design - How Designers Choose Which Fonts To Use. [online]
Available at: https://designschool.canva.com/font-design/ [Accessed 4th
November. 2017]
Shortie Designs, (2017) 10 Top Principles of Effective Web Design - Shortie Designs. [online]
Available at: https://shortiedesigns.com/2014/03/10-top-principles-effective-web-design/
[Accessed 4th
November. 2017]
Design School, (2017) Design Elements and Principles - Tips and Inspiration By Canva. [online]
Available at: https://designschool.canva.com/design-elements-principles/ [Accessed 4th
November. 2017]
Nielsen Norman Group, (2017) Top 10 Application-Design Mistakes. [online] Available at:
https://www.nngroup.com/articles/top-10-application-design-mistakes/ [Accessed 4th
November.
2017]
Creative Bloq, (2017) How to master colour theory. [online] Available at:
http://www.creativebloq.com/colour/colour-theory-11121290 [Accessed 4th
November. 2017]

User Interface Design Concepts

Recommended

Recommended

More Related Content

What's hot

What's hot (20)

Similar to User Interface Design Concepts

Similar to User Interface Design Concepts (20)

Recently uploaded

Recently uploaded (20)

User Interface Design Concepts