Applying the Thirteen principles of display design to our wireframe


  1. Make displays legible (or audible).

clear and simple greeting, followed by a simple question prompting the user to select something from the available options


2. Avoid absolute judgment limits. Do not ask the user to determine the level of a variable on the basis of a single sensory variable (e.g. colour, size, loudness) These sensory variables can contain many possible levels. =

this principle can be a little tricky to follow, but it simply suggests that you try to avoid putting your user in a situation where they must make comparisons based on single sensory variable like colour, size, loudness, this kind of ties in with principle 5, which talks about using distinguishable element, ones that don’t require much comparison, and an interface with element that is not easily distinguished is the only situation I can think of where the user would be forced to compare


3. Top-down processing. all users have expectations, those expectations are based on past experiences with other apps, this will affect how they perceive and interpret your app =

Instagram is a very popular app among our target audience, Emma has done some research into the app’s success and we are taking a lot of inspiration from it, this will help to make our app familiar to the users, minimizing any learning curve.


4. Redundancy gain. If a signal is presented more than once, it is more likely that it will be understood correctly. =

our app doesn’t really have any signals, more like signs, if people are going to be viewing our model on a small mobile screen then we believed it would be best to maximise the available space and avoid cluttering the screen, there are little bars at each edge of screen that allow the user to pull out menus and other sections of the app


5. Similarity causes confusion. Use distinguishable elements. Signals that appear to be similar will likely be confused. =

it is possible that the bars at edges of the screen could be confused, to fix this we plan to use distinct colours for each bar and menu/section.


Mental model principles

6. The principle of pictorial realism. A display should look like the variable that it represents (e.g. high temperature on a thermometer shown as a higher vertical level). =

This is pretty much just saying that what your designs should look like what your trying to represent, I think our designs do


7. The principle of the moving part. Moving elements should move in a pattern and direction compatible with the user’s mental model of how it actually moves in the system

this pretty much means that elements should move as the user expects it to move, or how they would move in the real world, this principle is very similar to principle 3, Conann mentioned that the animation of our 3D model using the correct running technique will look incorrect, thus we need a version of our animation were our 3D model is using an incorrect running technique to show our users why it is incorrect.


Principles based on attention

8. Minimizing information access cost. When the user’s attention is diverted from one location to another to access necessary information, there is an associated cost in time or effort.

All the necessary information will be accessible from a small information icon in the top right-hand corner of each technique demonstration, this will allow users to access, explanation of the technique, delivered by professionals and videos recording of techniques in use, this will help to prove our app is trustworthy and create a sense of empathy.


9. Proximity compatibility principle. Divided attention between two information sources may be necessary for the completion of one task. These sources must be mentally integrated and are defined to have close mental proximity. Information access costs should be low, which can be achieved in many ways (e.g. proximity, linkage by common colours, patterns, shapes, etc.). However, close display proximity can be harmful by causing too much clutter.

This is a problem that I’ve been conscious about for a while, showing our model performing the technique is one thing but we need to ensure that information is getting across to our users; we will need to incorporate infographics into our animations, clearly showing important information of the technique, e.g. showing the arch that athletes need to in what performing the high jump


10. The principle of multiple resources. A user can more easily process information across different resources. For example, visual and auditory information can be presented simultaneously rather than presenting all visual or all auditory information.

We are planning to use both visual and auditory cues for many of the functions in our app


Memory principles

11. Replace memory with visual information: knowledge in the world. A user should not need to retain important information solely in working memory or retrieve it from long-term memory. A menu, checklist, or another display can aid the user by easing the use of their memory. However, the use of memory may sometimes benefit the user by eliminating the need to reference some type of knowledge in the world (e.g., an expert computer operator would rather use direct commands from memory than refer to a manual). The use of knowledge in a user’s head and knowledge in the world must be balanced for an effective design.

I think our design balances knowledge pretty well using both the infographic mode and the information window


12. The principle of predictive aiding. Proactive actions are usually more effective than reactive actions. A display should attempt to eliminate resource-demanding cognitive tasks and replace them with simpler perceptual tasks to reduce the use of the user’s mental resources. This will allow the user to focus on current conditions, and to consider possible future conditions. An example of a predictive aid is a road sign displaying the distance to a certain destination.

I don’t believe that our app contains any demanding cognitive tasks everything has been designed to be easy and simple to use

13. The principle of consistency. Old habits from other displays will easily transfer to support processing of new displays if they are designed consistently. A user’s long-term memory will trigger actions that are expected to be appropriate. A design must accept this fact and utilize consistency among different displays.

This sounds like it’s saying that it’s a good idea to use elements from other apps or rather have those elements function in the same way, thus this principle kind of ties in with principles 3 and 7, talking about how we should try to make our app function and move in a way the user would expect. This 13th and final principle almost confirming that the methods we used to design our app were valid


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s