App Design Research

App Design:

Application Design refers to the creation, especially graphically and interactively, of applications. Nowadays, this usually refers to the creation of mobile applications, specifically for smartphones. Following the rise of said devices, the need for clean and readable User Interfaces and enjoyable User Experiences has risen.

The App Design market is heavily saturated, with many high-budget companies and indie start-ups providing good services and products; however, many designs are terribly flawed and provide an unsatisfactory User Experience. In order to create an efficient and user-friendly application, one must pay attention to the principles and elements of art and design, and how they intertwine with the human psychology. Thus, the User Experience is improved through the creation of a good User Interface.

Various groundwork must be put into place first, the designer needs to identify the function of the application, the desired target audience and the factors surrounding the influence of these variables.

As the application is designed, the elements and principles of design should be applied to the interface, ensuring that any user is instinctually aware of where they must go to access whatever it is they desire. Simplicity is key; clean shapes and minimalistic use of colour references ensures that the user knows what a symbol represents.

Example: A check/tick shape in green signified accept, while a cross/X in red signifies cancel or close. These are symbols and colour-references that have been ingrained in our psychology, further perpetuated by modern application design.

User Interface and User Experience are two extremely important elements when it comes to the overall design of an application, with User Interface requiring that the layout is attractive and User Experience requiring that the application is easy and enjoyable to use.

The use of mapped out wireframes, grids and tappable areas is incredibly important, as these allow you to plan the layout, readability and accessibility of your application. They also allow you to more efficiently adapt the design across platforms and devices, creating a cleaner and more efficient set of shapes to work with. Before finalising your wireframe, you must create a comprehensive flow map, detailing the potentials paths that a user may take to access the various parts of our application or website.

It is important that your test the User Experience responses to each stage of our design process, creating prototypes and gaining feedback on how to improve your current design.

Some advice to note, mostly for User Interface and Experience Design:

-Have extra views, as this will help de-clutter each individual page

-Create customized button styles that fit the theme of your application

-Ensure functional design over purely visually attractive design

-Avoid low-resolution elements, as well as the over-use of animations

-The user needs to know what is happening and what they are viewing at all times, ensure that they are aware of where they are in the application and what is currently occurring

-The main elements and objectives of a page and application should be highlighted using the principles and elements of design, ensuring a readable and clear purpose that aligns with the goals of the end user

How has App Design changed and developed since the start of smartphone based computing?

Application Design, as well as Website Design (both may fall under Graphic Design), has changed since the rise of smartphones. Compatibility is the main issue, with sites needing to be readable and accessible on both a large and small screen, varying in sizes and resolutions. To combat this issue, computer and mobile-based site versions are available on some hosting services. However, another way to ensure an application or website is readable interchangeably from device to device, design utilizing bold, graphic shapes and clean sets of colours is imperative. This allows users on mobile to access menus and desired tabs/pages easily and accurately, lowering the chance of ‘mis-clicking’. This also allows the application’s design to dynamically format to the resolution and size of the device’s screen while maintaining order and readability.

This adaptive formatting of websites and applications, and the use of specific edited versions for different devices’ User Experiences, has been dubbed Responsive Design.

An important factor to this dynamic formatting would be a grid system, with a series of blocks and rectangles that appear in different configurations when viewed on different devices or platforms, commonly referred to as Masonry Design.

How has Interactive Media authoring/creation changed since the invention of interactive systems? (Phones, tablets, computers). [Why have CD-Roms and DVD players become obsolete?]

Nowadays, just about anyone with a computer and internet connection can create and publish an application one of the many app stores worldwide. This, combined with the range of capabilities of the devices that are available today, render most old forms of specifically-purposed technologies obsolete in the current day and age. Going forward, more and more old sets of technological inventions will become less and less useful due to the extensive uses and functionalities of computers and mobile devices.

A device, of which can fit in your pocket, can access the internet, stream video, interact with various applications, message and call others is more efficient and useful than a bulky DVD player with a singular purpose. Nowadays, you can connect said mobile device (a computer or tablet may perform this task as well) to a smart TV, allowing you to watch a variety of content without the need for a singular purpose machine or device. Smart TV’s also have the capability to access the internet and stream video, as well as utilizing a series of applications.

Efficiency, accessibility and variety is what is pushing this modern technology far ahead of their older, more singular-purposed archaic counterparts. When designing an application or device in this modern era, one must consider not only the principles and elements of design, the tried and true theories in graphic design and psychology, but also the needs, wants and demands of modern life and people in this technology driven age.

App Design Moodboard


This slideshow requires JavaScript.


5 Good App Designs:


Spotify Mobile App:

Spotify is an incredibly intuitive and efficient application, allowing you to stream music anywhere and everywhere. Backed up by a plethora of genres, suggestions, playlists, songs, artists and settings, your listening experience is highly customizable.

In regards to visuals, it opts for a sleek and minimalistic look that is driving forward many design philosophies of this modern era; simplicity, readability, efficiency and ease of use/navigation, authentic and emotive photographs, hand-created icons that are instantly recognizable (and are backed by accompanying text in a clean, simple font), and the restrained use of bright colour (bright green for certain actions such as typing, shuffle play and toggling options).

Readability and navigation wise, it is a highly efficient application, with a bar of helpful main sections at the bottom, your current song (of which can be paused/played or brought up/down via an arrow), and simplistic and informative lists and titles that allow you to navigate the world of music through a categorized and search based system.

Spotify is extremely neat, with the clear images, graphics and text standing out on the dark background. There is a clear hierarchy of information, with different values being assigned to important headings, song/album/artist tiles and extra information.

Interacting with Spotify is a smooth and efficient experience, with interactive options that allow you to quickly navigate to various ‘hubs’ and pages in the application. Having the ability to access your current song, playlist and all of the various artists, albums and songs via that at any moment provides you with instant access and interactivity. Not only that, but you are also constantly discovering new songs via the suggested songs and related artists sections, as well as the various playlists, genre sections and radios that are available.


This slideshow requires JavaScript.


Instagram Mobile App:

Similarly to Spotify, Instagram ops for a more simplistic and elegant approach; the focus is on the images that are posted, with a hierarchy of information created through the use of text, font, type-face, symbols and imagery.  Interactivity is easy, with a bar (Similar to the one in Spotify) at the bottom of the screen of which allows you to access the home screen, search, add a new photo or video, look at your favourites/likes or view your own profile. From either of these sections, you are provided with a variety of interactivity options that only require a few, possibly even one, press to access or interact with.

Where Spotify opted for dark monochrome colours with hints of green, Instagram instead uses whites, greys and highlights of blue to show certain prompts or current selections. Most images and areas of text have their own demarcated circles, rectangles or squares, allowing for a variety of phone sizes and screen ratios to access the application (the same goes for Spotify).

Swiping left or right at the top bar, near the word Instagram (dark and highly contrasted against the light background), will allow you to either take a photo/video or access your direct messages. Two icons help represent this, of which may be clicked on to access these sections as well, and are highly recognizable in their intentions due to the symbolism and contrast used in their designs. Similarly, one may like, comment or share a post with a friend via the line-based designs underneath the images. The user will understand and associate these with the filled in icons and understand that they may be interacted with, their intentions clear via their symbolism-based designs. Once an image has been liked, the heart will fill in with a bright red, indicating its status to the user.

Overall, the application makes use of a simplistic, efficient and minimalistic design direction to help keep the creation, interaction and consumption of media the focus.

This slideshow requires JavaScript.


Once again, the trend of the hub-based bottom bar has continued. This time, the predominant colour is purple, aided by the monochromatic and simplistic designs that occupy the background and navigational menus/options. Important sections, information and current selections are assigned colours, helping them to stand out from the background and take hold of your attention to notify you of their status.

Being an application that helps you track your mood, a calendar and emotive based system is used to quickly and efficiently record and track your emotions throughout the various months. The emotional states, that are options for you to choose from, are assigned certain colours and descriptions; these range from rad (orange) to awful (dark grey). One may track their progress through the calendar and statistic pages, allowing them to see and alter trends in their emotional states.

Various options and settings exist, allowing you to personalize your experience via editing moods, activities and toggling whether or not you would like to have reminders to prompt you to record your emotional state at any given time of the day.

When recording or viewing your emotional state, you are given the option to affect or view your average mood or a variety of other activities. Readability is paramount here, with a white rectangle pop-up that jumps to the foreground, the background faded in grey, with a list of activities to choose from. Each one has an icon (with colours) assigned to them, with the amount of times they have been tracked next to them in brackets. The hierarchy goes as thus; Heading, Icons, Description, Extra Information, with each section being given a clear position through the use of colour, size and value.

Font-wise, the application remains consistent, with the only variant being in size and value.

Overall, the application is clean, effective and efficient in both navigation and interaction. The aesthetic style remains true to the trend of today’s applications; clean, minimalistic, monochromatic but with a hint of colour to help readability and amplify the UI/UX.


This slideshow requires JavaScript.

Daylio, sadly, includes advertisements that require payment to disable. Not only that, but the option to export your entries is locked behind a paywall; premium membership.


Shazam, like the previous three applications, continues to utilize the graphic, simplistic and hierarchical design structure that allows for ease of use and clear readability. Although it does assign certain sections, graphic shapes and clear wireframes to headings, options and selection options, the use of its characteristic bright blue and orange colours are rather liberal.

Even though this helps construct a coherent graphical style, it does wear down on the user’s vision and attention span. However, the application is only meant to be used in short bursts, so in that context the bright and simplistic design direction actually heightens its effectiveness.

Once again, options and interactivity options are displayed via a hierarchical network of text, colour, symbols/icons, drop down menus and interactive drop downs. To access the various parts of the application, one need only swipe sideways or select on of the clean, directly understandable icons displayed on the screen.

To use Shazam’s main function, the identification of music, one need only tap the large icon labeled ‘Tap to Shazam’ in order to prompt the application to listen and attempt to identify the music it is presented.

Navigation is smooth, especially due to the hierarchical network of information, sections and lists; although the bright use of colour and various icons from other applications that you are prompted to use distract the user and put strain on the eyes if viewed for extended periods of time.


This slideshow requires JavaScript.

Pinterest Mobile App:

Pinterest follows the same style as Instagram and Spotify, with its monochromatic scheme and limited use of bright colours leaving room for the centre stage attraction; the images shared, searched for and pinned on the application.

The application and experience is efficient and pleasant, with the options to search, post or access settings at the top of the screen. You may also create various boards, follow genres/boards, pin images and explore other user’s profiles.

Options that may appear on screen, while still editing or accessing a specific tab, appear ‘on front’ of the background, fading all but its own contents to grey.

Once again, a hierarchy of information is created through the use of images, symbols, values, colours (especially red, of which is used on certain options and prompts, usually for final actions), font sizes, placement, negative space and graphic shapes.

This slideshow requires JavaScript.

3 Bad App Designs:

Anniversary Birthday Reminder:

This application, aiming to provide a reminding service for birthdays, anniversaries and events, is rather poorly designed. The visual aspects of the app are extremely cluttered, with a variety of colours and tangents fighting for your attention. Although it tries to opt for a sleek design, through the use of minimalistic graphics, it falls short and presents an oddly cluttered and confusing layout. This is mainly due to the poor wireframing, positioning and combination of colours.

The ‘tags’ alongside the list inside the events section are confusing and difficult to read, with a purple colour on a cyan strip, sideways, while connecting by a tangent to the related image.

This slideshow requires JavaScript.

Kanban Board:

Kanban Board, an application designed for note taking, relies upon its novel appearance as an approximation to sticky notes stuck upon a board comprised of a cork-like material. This, in theory, may sound like a good idea; creating a note taking application that simulates a possible route of note taking in real life, adding a sense of realism and tangibility to the notes you are taking.

However, the design of the application, in regards to its visuals, is highly flawed. The greeting screen is decent enough, with three title-customizable columns that default to TO-DO, DOING and DONE. The top left of the screen features a plus button, the top right a trash bin icon. The user will be aware that the plus will add a new note, while the trash bin icon will delete a note. However, the main issues come in when observing the variety of textures, colours and icon styles, as well as fonts on display.

Upon clicking upon the plus button on the top left, you are prompted to add either a green or yellow note, or select an orange and white plus button. These icons are separated from the tiled background texture via a semi-transparent black strip with a small title saying; Add note. If one accesses the orange and white plus button, you are sent to a mostly black screen prompting you to ‘Download more note.’ Next to this, a smaller green bar prompts you to ‘Find out more’ with an arrow indicating a drop down near it. This bar, bearing close resemblance to advertisement pop-ups and embeds, makes the user wary to access it.

Another large issue is the disconnection between pages and fonts, with headings, text placeholders/prompts and other sections with text having a variety of different fonts and sizes. Not only that, but there are grammatical errors in some section; ‘Download more note’ and ‘LIST MORE NOTE’ being two prime examples.

Colour and texture wise, there is much to be desired. While the section prompting you to download more notes uses a somewhat cleaner aesthetic, it does not flow well from the heavily textured attempt at emulating a realistic board. When clicking on the plus button on the top left and then proceeding to create a new note, by clicking on either the green or yellow icon, you are able to type up a note. The note appears as a square shape, with one corner folded, in a rather garish green or yellow with grey substitute text. This is difficult on the eyes, with the grey text being difficult to focus on due to the distracting colour it is placed upon, as well as the heavily textured, yet faded out, background.

The size icon, a rather typical floppy disk icon of old, is present on the top left of the note. This further perpetuates the lack of consistency of icons, with the different buttons possessing different styles and levels of detail.

Overall, the application tries and fails to create a novelty note taking system, the inconsistency of styles and difficult-to-view visuals places strain upon the user’s eyes and discourages them from further use of the app.

This slideshow requires JavaScript.

Note Droid:

Note Droid takes what Kanban Board did, but does it to an even worse degree. Once again the user is greeted with a cork-textured board background, with a wooden strip at the top of the screen. Upon this sits the titles of the application, a search tool (indicated by a magnifying glass) and another icon that allows to to create a new category. The pop-up window that appears allows you to edit the name of the category, the ‘Pushpin’ colours, as well as the colours of the note that indicates the category.

Another issue with this application that coincides with the flaws of the previous app is that it features a variety of icon and font styles, rather disconnected from one another. The drop down menus are drastically different from the rest of the application, featuring a much cleaner aesthetic.

Upon creating a new note, you are presented with a new page featuring a note appearing as though it is part of a large notepad, the previous pages torn out. The font for the title at the top of the screen, the font for the titles and text of the notes, and the font used for the drop downs are all different. This may be a good thing, yes, it can help organise the different functions of the application by assigning them with different visual styles. However, the difference is rather jarring when combined with the various different background styles and aesthetics.

The icons, for the most part, stay consistent throughout the pages.  They stay within the top strip of the page, allowing you to save, return or access a drop down (of which lets you share the note) when typing up a note.

This slideshow requires JavaScript.

Adverts appear to be commonplace in many applications, with some of these apps allowing you to opt out via payment. Some, however, have no such option. Ideally, an application with no advertisements would be desired.



Broderick, J. (2011). Camera Button. [online] Dribbble. Available at: [Accessed 28 Sep. 2017].

Clapham, S. (2013). How website design has changed with the rise of Tablets & Smartphones – Parachute Digital Marketing. [online] Parachute Digital Marketing. Available at: [Accessed 28 Sep. 2017].

Creative Bloq. (2013). 10 things web designers need to know about app design. [online] Available at: [Accessed 28 Sep. 2017]. (2014). User-friendly mobile Apps – 12 Must have Design Elements to Follow (Part 1) – [online] Available at: [Accessed 28 Sep. 2017].

Flarup, M. (2016). What You Should Know About The App Design Process. [online] Available at: [Accessed 28 Sep. 2017].

Grannell, C. (2017). How to make an app in 2017. [online] Creative Bloq. Available at: [Accessed 28 Sep. 2017]. (2015). Factors to Make a Successful Mobile App Design – GraphicLoads. [online] Available at: [Accessed 28 Sep. 2017].

Ling, T. (2017). Nexus Screen Android UI Design Kit PSD Mockups – PSD Mockups. [online] PSD Mockups. Available at: [Accessed 28 Sep. 2017].

Matzner, R. (2012). Designing a Mobile App? Don’t Make These 10 Mistakes. [online] Mashable. Available at: [Accessed 28 Sep. 2017].

Molla, R. (2017). How Apple’s iPhone changed the world: 10 years in 10 charts. [online] Recode. Available at: [Accessed 28 Sep. 2017].

Moore, J. (2017). A Step-by-Step Guide for Starting a New App Design Project in Sketch. [online] Medium. Available at: [Accessed 28 Sep. 2017].

Moreira, J. (2012). Archivme iPad app – iOS. [online] Dribbble. Available at: [Accessed 28 Sep. 2017].

Pierce, D. (2016). How Apple Taught the World to Smartphone. [online] WIRED. Available at: [Accessed 28 Sep. 2017].

Qayyum, A. (2012). 9 Easy Steps Towards Designing an iPhone App. [online] Available at: [Accessed 28 Sep. 2017].

Rocheleau, J. (2017). Ultimate Resources For Mobile Web Application Design. [online] HKDC. Available at: [Accessed 28 Sep. 2017].

Skyboy Design | Cape Town | Graphic Design | Branding | Interface | Web. (n.d.). UI Design: Mobile app for photographers by Skyboy Design. [online] Available at: [Accessed 28 Sep. 2017].

Smith, K. (2012). Interface Buttons for iPhone & iPad Applications / Design Tickle. [online] Available at: [Accessed 28 Sep. 2017].

Staff, C. (2015). 16 killer design tips for creating mobile apps. [online] Creative Bloq. Available at: [Accessed 28 Sep. 2017].

Tierney, P. (2012). Good design/bad design – phone app wireframe. [online] phmtierney – web design for photographers. Available at: [Accessed 28 Sep. 2017].

Titcomb, J. (2017). 10 ways the iPhone changed the world. [online] The Telegraph. Available at: [Accessed 28 Sep. 2017].

Anon, (2011). [online] Available at: [Accessed 28 Sep. 2017].

Barron, B. (2016). Cite a Website – Cite This For Me. [online] Available at: [Accessed 28 Sep. 2017].

Cao, J. (2017). 10 Worst Design Failures of All Time. [online] Studio by UXPin. Available at: [Accessed 28 Sep. 2017].

Rutherford, Z. (2015). 6 examples of awful UX design. [online] The Next Web. Available at: [Accessed 28 Sep. 2017].

Sandy, B. (n.d.). Menus And Buttons In Mobile Design – 45 Examples. [online] Design your way. Available at: [Accessed 28 Sep. 2017].

WebAppers. (2011). More Awesome CSS3 Buttons for Your Web Application. [online] Available at: [Accessed 28 Sep. 2017].


Storyboard and Animatic Research

Storyboard Research:

Storyboards are used to illustrate the shots and scenes that make up the final animation and/or film, allowing you to plan out what it will look like and how to create it. A storyboard is usually comprised of a rectangular frame called a panel, this shows the content of what the camera sees. Using storyboards, you can establish the camera angles and perspectives you will use early on, as well as the locations, props and effects needed for the different parts of the animation and/or film.
To show movement, the use of arrows is generally employed. These show the direction something is moving in, be it a character, door or camera. Arrows within the panel indicate movement within a scene, arrows outside of the panel are used to show camera movement.
It is better to over explain than to leave information in ambiguity. Notes are extremely useful, helping to create clarity and communicate the information more effectively. These notes can be outside the panel, usually below, or inside arrows.

Types of Shots:

Camera Angles:
Extreme Long Shot:
-Camera is positioned far away from the subject, good for establishing the environment and the character’s position within it, especially useful for new environments, areas and locations.
Long/Full Body Shot:
-Closer than the Extreme Long Shot, showing the entire character.
Medium Shot:
-Closer than the Long Shot, usually showing a character from the waist up or down. Medium Long Shots can be used to show the character from the knees up.
Close Up:
-Close-up shot of the subject that usually shows, although it is not limited to, the character’s head.
Extreme Close Up:
-An ever closer viewpoint, usually used to highlight a specific element. Often used to show the eye’s of a character.
Up Shot:
-Camera is tilted up, viewing the subject matter from below. (Can be combined with the previous shots)
Down Shot:
-Camera is tilted down, viewing the subject matter from above. (Can be combined with the previous shots)
Low Angle:
-Camera is positioned lower in relation to the subject, however it is still pointed towards the horizon line. (Can be combined with the previous shots)
Tilt (Dutch):
-The camera is tiled and held in an angle, usually used to create an unsettling and unstable feeling.
Pan Shots:
-Pans are when the camera moves within an environment, physically changing position. Usually used to show the movement of the subject matter or the changing of the audience’s point of view.
Horizontal Pan:
-Camera moves in a horizontal direction, parallel to the horizon line.
Vertical Pan:
-Camera moves vertically, usually tracking a character’s movements and adjusting accordingly.
Diagonal Pan:
-Camera moves diagonally, using both horizontal and vertical movement.
Non-Linear Pan:
-Camera follows the subject.
Camera Angles, Movements and Arrows:
-The manipulation of the camera, its viewpoint, and its direction.
Track/Dolly Shot:
-One arrow that narrows to suggest movement in or out of 3D space.
-Arrows in all four corners of the panel, going in or out, showing narrowing or widening of perspective. Drawing a panel within the panel shows how far the dolly goes.
-Often used to track/follow a character through a scene, usually keeping pace and creating a background that ‘pans’ behind them.
Zoom In/Out:
-Arrows in all four corners of the panel, going in or out, showing narrowing or widening of perspective. Drawing a panel within the panel shows how far the zoom goes.
-Similar to a tilt, the camera moves from one angle to another in a rocking or spinning movement. The angle could range from several degrees to a complete 360 degrees rotation.
Rack Focus:
-This is where one element is in focus with everything else being out of focus, then the focus changes to a different subject within the scene. Usually this in-camera movement is paired with others, such as a zoom.
Pan Right/Left:
-Pans to either the left or right are shown with arrows on the sides of the panel.
Tilt Up/Down:
-Tilts have arrows on the top or bottom of the panel.


 Character Shots:
One Shot:
-One character
Two Shot:
-Two characters
Three Shot:
-Three characters
Crowd Shot:
-More than three characters
-Foreground character and background character. Camera looks over/past shoulder of foreground character. Foreground character = framing element.
Establishing Shot:
-Establishes scene and location.
Point of View (Subjective):
-Camera = character’s eyes
-Characters are seemingly unaware of the camera, as though it is hidden in the environment. Most movies are filmed this way.
-Similar to the Object Shot, however it usually involves a more ‘hidden camera’ kind of feeling, with the content being something you normally would not be able to see.
Split Screen:
-Screen is divided into segments, showing the audience multiple scenes at once.

Types of Scenes:

-Physical movement is occurring.
-No intense physical movement.
-Character/s are talking.
-A series/sequence of events/scenes that are related, highlighting important shots.
-Silhouetted scenes, usually used to invoke a creepy and/or unsettling mood/atmosphere.

Cuts and Transitions:

-Changing from one scene to another in order to advance the story and establish a different perspective.
Cutting in Action:
-Moving from shot to shot as the subject is in motion.
Cut Away:
-Cut to an insert shot of something, and then back again.
Cross Cut:
-Cutting back and forth between locations and scenes.
Jump Cut:
-Cuts between and inside the same shot, used to show the passing of time, especially in montages. They can be used to add urgency to a scene, adding a frantic nature and/or…
-Cuts from one shot, to a similar shot, by either matching the action and/or composition. These are usually used as scene transition, as they are often ‘jumpy’. They can also be verbal/auditory, with the continuation of sentences/music/sounds being part of the transition.
Fade In/Fade Out:
-Dissolving to or from black.
-Blending one shot into another, usually used in montages and the communication of the passage of time.
Smash Cut:
-Abrupt transitions, making use of contrast in mood, tone and visuals etc.
-Dark circle closing in or expanding from an area in a shot/scene.
-One scene ‘wipes’ off across the scene, revealing another one ‘below’ it. This can also happen with the second screen going over the first, ‘wiping’ across it and ‘hiding’ the previous scene.
Invisible Cut:
-Cuts that are hidden in blackness/darkness, the movement of an object within/crossing/leaving the scene/frame or camera motion/movement (whitpans).
-Audio based transition, with the audio from the current shot carrying over to the next shot.
-This is when the audio from the next scene starts before it visually appears, this technique is good for revealing a new element within the scene.
Cross Dissolve:
-One image/scene is gradually replaced by another, with the fading taking place over a number of frames with a percentage tied to each increment/frame.
Ripple Dissolve:
-Same as Cross Dissolve, however there is an effect/filter applied to make the image look distorted.
-Screen fades to or from black.

Animatic Research:

Animatics are essentially animated storyboards, matching your storyboard with the timing, basic audio and pacing of the animation. Animatics are effective for pre-visualisation, taking storyboards a step further. They allow you to bridge the gap between storyboards and the final animation, letting you plan out the final animation more effectively.

References (2017). storyboards. [online] Available at: [Accessed 1 Apr. 2017].
Albright, J. (2012). How to Make a Storyboard – Storyboard Lingo & Techniques. [online] Available at: [Accessed 1 Apr. 2017].
Berkeley Advanced Media Institute. (2016). Storyboarding. [online] Available at: [Accessed 1 Apr. 2017].
Creative Bloq. (2005). Create an Animatic. [online] Available at: [Accessed 2 Apr. 2017]. (2017). Storyboard. [online] Available at: [Accessed 1 Apr. 2017]. (2017). Tracking shot. [online] Available at: [Accessed 2 Apr. 2017].
Jazza (2013). Available at: [Accessed 2 Apr. 2017]. (2017). Kingston College School of Art & Design. [online] Available at: [Accessed 1 Apr. 2017].
Koning, W. (2013). Available at: [Accessed 2 Apr. 2017].
Lafferty, K. (2013). Available at: [Accessed 1 Apr. 2017].
Lemay, B. (2017). Storyboarding Basics by Brian Lemay. [online] Available at: [Accessed 1 Apr. 2017].
Lemay, B. (2017). Suggested Animation Type Books. [online] Available at: [Accessed 1 Apr. 2017].
RocketJump Film School (2016). Available at: [Accessed 1 Apr. 2017].
Schaaik, E. (2015). Available at: [Accessed 2 Apr. 2017].
Storyboard That. (2017). Camera Shots | Action Cues | Establishing Shot Storyboards. [online] Available at: [Accessed 1 Apr. 2017].
Toon Boom Animation. (2017). Animatic. [online] Available at: [Accessed 2 Apr. 2017].
Zamora, M. (2012). Types of Shots and Storyboard. [online] Available at: [Accessed 1 Apr. 2017].

2D Animation, Snow White and Techniques Research

The animation process used in Snow White and the Seven Dwarfs is the use of cel animation. This form of animation makes use of sequential hand drawn frames, usually done on a stack of paper. This allows the animator to flip the pages back and forth, checking the sequence of movements in a way similar to that of a flip book. To aid with this process, of which is time consuming, key frames, storyboards, and final designs are usually established before the main body of animating work is commenced. Once the animation is mostly complete, the drawings will be traced, with ink, onto plastic cells (transparent sheets), painted and then compiled together over the background art to create the final animation.
In regards to the animation techniques used in the creation of Snow White and the Seven Dwarfs, traditional cel animation was employed. Seeing as this film was the pioneer for this technique and process when it came to feature films, the large scale production was pioneering in the field. Once the story, storyboards and conceptual art had been completed, dialogue is recorded and then the animators set to work creating thousands of drawings, using pencils and traditional flip-book techniques for the sequential nature of the animation. Usually, the more experienced animators will create the main ‘key-frames’, while others will draw the in-between frames to complete the scenes and movements. After the bulk of the animating work was completed, the drawings were handed off to other employees to trace, using ink and transparent sheets of plastic to recreate the drawings. Painting came next, with every single frame (cel sheet) being painted and coloured, with the paint being applied to the back of the sheets to preserve the inked line quality. Once this has been completed, the sheets were compiled over the backgrounds, painted using Tempera or Water Colour onto panels of glass, and photographed in sequence, effectively creating the animation.
During this entire process, the animators and various other members of the studio would test their animations and seek feedback, personally viewing as well as presenting rough animations and sequences to their peers. To accompany the animation, sound effects and musical scores were creating. As they did not have sophisticated music production software back in those days, all of the sounds and music had to be manually created and recorded, allowing them to have a more authentic and real sound quality to them.
Not only did Disney Studios create the first full-length animated feature film, but it was a pioneer in large-scale cel animation, the use of Technicolour and multi-plane camera use.


Backlots. (2012). Disney Production Process and Innovations in Animation Technique in “Snow White and the Seven Dwarfs” (1937). [online] Available at: [Accessed 1 Apr. 2017].
Boone, A. (1938). The Making of Snow White and the Seven Dwarfs – Popular Science (Jan, 1938). [online] Modern Mechanix. Available at: [Accessed 1 Apr. 2017].
Colman, D. (2011). How Walt Disney Cartoons Are Made: 1939 Documentary Gives an Inside Look. [online] Open Culture. Available at: [Accessed 1 Apr. 2017]. (2017). Walt Disney Animation Studios. [online] Available at: [Accessed 1 Apr. 2017].
Just Disney. (2017). Walt Disney Studios Animation – Just Disney. [online] Available at: [Accessed 1 Apr. 2017].
McQuade, K. (2013). The Many Stages Of Pixar Development As Told By Reddit. [online] The Huffington Post. Available at: [Accessed 1 Apr. 2017].
Simon, B. (2002). The One That Started It All… The Making Of Snow White – Animated Views. [online] Available at: [Accessed 1 Apr. 2017].

Animation Timeline and History Research

-Thaumatrope (1824)
-Phenakistoscope (1831)
-Zoetrope (1834)
-Flip Book (1868)
-Theatre Optique by Charles-Emile Reynaud (1892)
-The Humpty Dumpty Circus (1897)
-Humorous Phases of Funny Faces by J. Stuart Blackton (1906)
-Katsudo Shashin (1907)
-Fantasmagori (1908)
-The Cameraman’s Revenge (1911)
-Gertie the Dinosaur (1914)
-Cel Animation (1914)
-Rotoscoping (1915)
-El Apostle (1917)
-Felix the Cat (1920)
-Adventures of Prince Achmed (1926)
-Steamboat Willie by Disney Studios (1928)
-Flower and Trees [Technicolour] by Disney Studios (1932)
-Three Little Pigs by Disney Studios (1933)
-Snow White and the Seven Dwarfs by Disney Studios (1937)
-The Huckleberry Hound Show by Hanna-Barbera (1958) on Colour Television [Introduced in 1951]
-The Flintstones by Hanna-Barbera and Zerography Technique (1960)
-Watership Down using Dolby sound (1978)
-3D animated feature films using CGI [Rock and Rule] and Stereoscopic techniques [Abra Cadabra], Animated TV Series using Stereo Sound (1983)
-The Simpsons [Longest running American animated program] (1987)
-Who Framed Roger Rabbit, first feature film where live-action and cartoon animation, for the entire film, shared screen space (1988)
-Beauty and the Beast is the first animated film to be nominated for the Academy Award for Best Picture (1991)
-Toy Story [First entirely CGI animated feature film] (1995)
-Final Fantasy: The Spirits Within [Motion-capture animation] (2001)
-Wizards and Giants [First flash animated film] (2003)
-Cel-shaded animation Appleseed Steamboy (2004)
-Coraline [Stop motion character using rapid prototyping to aid animation] (2009)
-Big Hero 6 (2014)
-Moana (2016)


Anon, (2015). [online] Available at: [Accessed 23 Mar. 2017]. (2017). Animation. [online] Available at: [Accessed 23 Mar. 2017]. (2017). History of animation. [online] Available at: [Accessed 23 Mar. 2017]. (2017). history of animation. [online] Available at: [Accessed 23 Mar. 2017]. (2017). Kingston College School of Art & Design. [online] Available at: [Accessed 23 Mar. 2017]. (2017). History of Animation Timeline. [online] Available at: [Accessed 23 Mar. 2017].

Animation Techniques Research

Traditional/Classical/Cel/Hand-Drawn Animation:

Cel Animation Reference
This form of animation makes use of sequential hand drawn frames, usually done on a stack of paper. This allows the animator to flip the pages back and forth, checking the sequence of movements in a way similar to that of a flip book. To aid with this process, of which is time consuming, key frames, storyboards, and final designs are usually established before the main body of animating work is commenced. Once the animation is mostly complete, the drawings will be traced onto plastic cells (transparent sheets), painted and then compiled together over the background to create the final animation.
Adobe Photoshop
Toon Boom
Anime Studio

Vector Animation:

Vector animation entails shapes, created using digital software, being manipulated, rigged and moved. Usually, one would create several ‘assets’ that are interchangeable, layered and with several variations. This allows the animator to move the elements ‘through’ 3D space while using 2D vectors. Commonly, plugins, scripts and rigs are used for for efficiency, allowing the animator to rig a character with bone and join structures, allowing him/her to manipulate the nodes, of which then influence the parent-child relationship of the other, attached, nodes.
Adobe Flash
Adobe After Effects
Anime Studio

Stop Motion:

Usually, stop motion is created through the taking of a series of photographs. Clay, plasticine and wire are common materials for models that are used in stop motion animation, manipulated and moved each time before taking another image. The amount of photos you have per movement influences your frame rate. The sequence of photographs, when played as though they are a slideshow, give the impression of video, motion and animation. Stop motion allows the animator to experience a more tactile and physical form of animation, manually manipulating the clay and creating armatures by packing that clay over wire frames.

CGI/Computer/3D Animation:

3D animation makes use of a series of software packages, allowing users to model, rig and then animate their creations. Once a 3D model has been created, a rig (similar to an armature) can be created and then manipulated. The motions, since you are working inside 3D software, can be manipulated using X,Y and Z axis, allowing you to move the model through space. Once the animation is complete, the models textured, the lighting and physics established, the overall animation is rendered and has post-production effects and edits applied to it.
Autodesk Maya
Autodesk Softimage
Autodesk 3DS Max
Cinema 4D

Abstract Animation:

The main goal of abstract animation is to communicate emotion through the use of motion, colour, light, music, rhythm and composition. Usually, these types of animations lack story, but are instead visual and sound experiences intended for the interpretation of each individual viewer.

Motion Graphics:

Motion graphics, or animated type/font, is used widely in animation, film, TV, video and websites, especially during the title sequences of films. Although this form of animation may seem rather unique and different from the others, it is created in a similar way to vector animation, using software such as Adobe Flash and After Effects.
Adobe After Effects
Cinema 4D

Flip Book:

Flip book animation is similar to traditional animation in the sense that it makes use of a series of sequential drawings on paper, drawn in a way that allows the viewer to flip the sheets back and forth, seeing the illusion of movement as the pages are hidden and revealed. Each page is a frame of animation, the more pages per movement, the higher the frame rate.


For this form of animation, a series of images are drawn on a drum that is then rotated, as it turns in a circular direction the viewer experiences the illusion of movement.
Animation Moodboard:
Animation Moodboard.jpg


Bloop Animation. (2017). The 5 Types of Animation – A Beginner’s Guide. [online] Available at:[Accessed 23 Mar. 2017]. (2017). Abstract animation. [online] Available at:[Accessed 23 Mar. 2017]. (2017). Animation techniques. [online] Available at:[Accessed 23 Mar. 2017]. (2017). Cel. [online] Available at:[Accessed 23 Mar. 2017]. (2017). Celluloid. [online] Available at:[Accessed 23 Mar. 2017]. (2017). Traditional animation. [online] Available at:[Accessed 23 Mar. 2017]. (2017). Virtual cinematography. [online] Available at:[Accessed 23 Mar. 2017]. (2017). Film Education | Events | Primary animation | Animation techniques. [online] Available at:[Accessed 23 Mar. 2017].
Studies, (2008). Animation Techniques. [online] Available at:[Accessed 23 Mar. 2017]. (2017). 20 Different Types of Animation Techniques and Styles. [online] Available at:[Accessed 23 Mar. 2017].

Hope Research

-Meaning of Hope:
Hope revolves around the concept and state of mind referred to optimism or being optimistic. Both hope and optimism are related to how a person perceives and expects outcomes to unfold, usually expecting a positive outcome. Also tied in with hope is forgiveness and positivity, as well as a host of positive emotions. Opposing Hope are several emotions and states of being, such as hopelessness, fear and despair. All of these states of mind and emotions are heavily influenced by past experiences, chemicals in the brain, health, colour, perception, language, culture and various social factors. A major factor in hope, optimism and despair would be environmental, with family and social environments becoming a prevalent cause of despair and depression, especially among youths and teens.
Hope and optimism are integrally tied in together, with optimism being the precursor. Those who are not optimistic, whether it be by choice or various factors beyond their control, usually do not experience or empathise with hope or those experiencing hope. However, one does not need to be optimistic to experience hope, as even pessimists can experience it, however rarely. Although optimism does lead towards a more frequently hopeful nature, hope usually has more solidity than that of general optimism. Adding to that would be the pairing of motivation and self-discipline, which are important to the continued drive one needs to accomplish their goals. It can be argued whether or not motivation and self-discipline are equally important, on one hand motivation acts as a sort of inspirational boost that usually requires some external influence to trigger, self-discipline, however, is usually internal and relies upon the willpower and determination of the individual, arguably a better long-term strategy and path.
-Hope and Colour:
Colours regarding Hope:
Aqua and Olive Green: healing, protection and peace
Light Blue: health and tranquillity
White: goodness, purity and safety
Light Yellow: intellect, freshness and joy
Dark Blue: knowledge and power
Colours regarding Despair:
Dark Red: rage, malice and wrath
Dark Green: ambition, greed and jealousy
Yellow Green: sickness, cowardice, discord and jealousy
Black: death and evil
Dark Purple: gloom, sadness and frustration
Dark Orange: deceit and distrust
-Hope in Storytelling:
Hope is an integral part of storytelling, something which helps to drive the main character/s forward. The events that happen to that character usually shape them and their personality, the way they perceive the world and their hope. Many times in storytelling, the main character will have their hope or faith tested, whether it be in a concept or cause, and their reactions are what build them as a believable and relatable being. In such cases, various other characters usually have a role to play when it comes to the influence these events have on the character, with some preaching discouragement, while others may attempt to lift up the character. The struggle of mindset, perception and vulnerability is something that helps make characters more real, grounding them in reality and making them more relatable. The weaknesses, failings and struggles of the character allow us to empathise with them, an important part of creating a believable story. On many occasions, the viewers witness the growth of the character, seeing the highs and lows of their struggle and their more human aspects, something people don’t usually openly display. This look into the characters inner workings and perception of the world around them, relating to emotions such as hope and despair, helps create a tangible emotional connection between a fictional character and the audience, whom feel as though they are connected on an individual level.
The completion of tasks, especially ones previously viewed as impossible, helps build upon the feeling of hope and reigniting it if it was lost. When it comes to despair, one may perceive the world in a pessimistic or negative way, whether by choice or circumstance. If the character is able to conquer these states of despair and hopelessness, usually spurred on by a catalyst such as an event or person, they usually do so by completing a goal or task that they previously viewed as impossible. This creates a state where the character’s mindset changes, their perceptions of the world and their abilities evolve, and they become happier, optimistic and more content with their lives and situations.
Without hope in stories, the characters would fall into despair and never leave, however the contrast between hope and despair is integral to creating a believable journey and cast. To fully appreciate the strength of the character and their ability to maintain hope, you must also be aware of the odds stacked against them, their moments of despair, and the environments and situations they are thrust into.
Overall, the combination of catalysts, willpower and completion of goals leads to and contributes to the mental health of an individual, causing their mindset to shift into a more positive and optimistic viewpoint as their perceptions of the world and their abilities change.
-Hope in art, design, literature and/or film etc.:
When it comes to the use of hope in literature and entertainment, Star Wars is a shining example. Not only did they communicate a sense of hope successfully through the story, but they did so as well through colour, design and composition, making use of visuals to enhance key story points and further the narrative. The combination of visual and story-based elements is essential for communicating the direction of a film and the themes within. Added in with those factors would be the use of music, which in Star Wars is used effectively to display the emotions and moods within the various scenes.
An essential point in the first movie is when Luke is in a moment of quite contemplation, the twin suns of Tatooine in the distance before him. The emotional orchestral track, combined with the sombre, new dawn visuals, inspires a rising sense of hope. The viewer gets the sense that the character, Luke, is realising that there is more out that, that he can achieve something great. This builds on that sense of hope, the trust in something non-tangible. The trust that there is a possibility, no matter how slim or allusive, that you are able to achieve your goals and progress in life. People’s hopes are essentially goals, usually non-tangible and seemingly distant. Even though that may be the case, the hopes of Luke and his friends are fulfilled by the end, while the nefarious goals of their enemies are thwarted by the action of others placing their faith into the Force, something intangible, like that of hope.
Throughout the movies, this theme of hope is tested again and again, with setbacks being overcome through the use of willpower and the help of friends and mentors. The themes of mentor ship, friendship and selflessness are intrinsically woven in with that of hope. This is clearly displayed through the actions of Luke, as well as that of his companions. The hopes of these characters do change throughout the course of the movies, with Luke aiming to become a better man than his father, to restore peace and vanquish the Empire. Even though he does lapse into periods of darkness and rage, he is pulled out through realisations and the help of others. Instead of executing his father and leaving him to die, he helps him remove his helmet as he believes there is hope yet for him, he may be able to atone for what he has done. That moment is one of forgiveness and connection, a moment of bonding and understanding.
The message shown throughout is that of hope, faith and belief. One should trust that there is goodness in the world, and that there is hope for even those who have fallen into periods of darkness and despair. All you need to do is pull yourself out, through the use of willpower and the support of others.
-Hope in Body and Shape Language:
When it comes to emotions, shapes serve as a powerful tool of communication. The orientation of the shape, the shape itself, as well as the relative size and proportions, combines with the context that it resides in to display an emotion, or emotions, that the viewer may connect with. When it comes to shapes, there is a spectrum of emotional readability and understanding. The clarity of the communication may range from abstract to complex, from a simple circle to a complex arrangement of angular shadow shapes that build up a villainous character’s face. To organise the types of shapes used, one may arrange them into three categories; Geometric, Organic and Abstract. When organising these shapes, one must be aware of the negative space being used and created, as this can form a multitude of shapes that could compliment, harmonise or contrast with the positive.
Geometric shapes are the more conventional, such as circles, squares, diamonds and triangles. These shapes, being so commonly used, recognisable and easily made into patterns, communicate structure and organisation, as well as order through their usually symmetrical nature. However, when their orientation is off-balance and are influenced contextually by other shapes, they may display fearful and submissive characteristics and emotions. One such example may be this; an off-balance triangle, made of a de-saturated blue, points to the right at an acute angle, while a large square, comprised of bright, saturated red, tips towards it, off-balance by an, even more, acute angle. The smaller triangle slopes away from the larger shape, appearing as though it is cringing and retracting from the presence of the square.This situation would communicate instability and danger, the triangle appearing fearful before the much larger shape, threatening to topple.
Organic shapes stray away from the structure and order of the Geometric, moving more towards uneven edges and curves. Organic shapes are usually found in nature, non-conforming and free-flowing. The easy-going nature and soft edge quality usually conveys comfort and tranquillity. Depending on the arrangement of the curves in the edges, they shapes could display energetic qualities, the example of a roller coaster may be used to illustrate this; there are both areas of slow, calm climbs that are offset by sudden drops, something that is both visually and physically tangible when it comes to the actual roller coaster, however, this needs to be communicated through visuals alone using shape language.
Abstract shapes are more of a combination of geometric and organic shapes, creating something unique and stylised. Usually, abstract shapes are used as icons and symbols, with typography being an excellent example of abstract shapes being used for communication.
The quality of shapes, their colour, and their orientation, influences the way we perceive them. A sharp, red and angular triangle will communicate more aggression than a soft edged, light blue circle. The reason we perceive shapes in this way connects back to evolution and threat processing. Threat detection, and the processing behind it, is deeply ingrained in all of us and is constructed in a way that it requires minimal stimulation to trigger a response. Sharp, angular and aggressive shapes hint at predators and danger, triggering a fight or flight response. On the other hand, soft, curved and rounded shapes and features communicate affection and bonding, this is believed to come from the shape of a baby’s face and their rounded features.
Angles are incredibly important when it comes to shape language and design, and can influence the visual response that the shapes illicit from the viewer. Shapes with sharp declines communicate negative emotions, while upwardly curved edges would garner a more positive reaction.
Colour and shape go hand-in-hand, allowing designers to communicate emotion and information effectively, tapping into the human perception of the world. To communicate hope, one should recruit the help of both shape and colour in order to effectively display the intended emotion. The combination of rounded shapes, such as the circle, with peaceful and hopeful colours such as white and light blue, communicates hopeful characteristics. This is especially prevalent when put into context, with proportions and scale applied to it within that context. A white circle, with a hint of light blue or aqua, rising above a field of dark triangles will simultaneously display hope, danger and tension, especially if the background verges on a desaturated red, or perhaps a sickly yellow-green. An important part of this composition, and what it communicates, would be the proportional scale between the dangerous and hopeful elements, the visual weight of each influencing the predominant emotion. Even if the triangles are smaller than the circle, the amount and density of them may garner them more visual weight. Achieving the desired emotional response in an image requires a fine balance of that weight, something that is influenced by size, colour, shape and arrangement, as well as various other factors.
When it comes to animation, shapes are used extensively in order to communicate the desired meaning effectively and efficiently. Character designs are heavily influenced by shape language, design and psychology. The use of geometric and organic shapes not only makes animating easier, but also helps to easily display the personality of a character. A friendly character may be comprised of a series of repeating circles and organic shapes, while a villain may be built up of triangles, sharp and angular, housed within an overall triangular envelope. These designs are further enhanced by colour, helping to solidify the emotional response that the shapes communicate.
When it comes to body language, the expression of hope can be tied to that of confidence and the transition from reclusive body language to that state. Confidence, when communicated through body language, usually manifests itself as a combination of gestures and movements. Several ways in which confidence and likeability is shown, is through smiling, a good balance of eye contact, calm movements, stillness, arms gently held in front or behind you, standing tall and straight and having your head held high. To communicate hope, a person may be in a shy, fearful position, that then transitions into one of hope. To show this, the person may look up from a hunched position, gazing upwards with open eyes. They may begin to stand, straightening their backs and assuming a confident, strong stance. The action of gazing upwards, combined with the overall postural transition, helps to communicate a sense of hope and path to success.
The use of clothing adds the perception of hope, as well as the lack thereof. Characters in movies and animation usually have clothing that reflects their personality and position in the overall story, as well as their own. In Star Wars, clothing is used to visually represent the position of the characters in the story, as well as their personalities. Luke, especially in A New Hope, are white. This ties in perfectly with the themes of hope that run throughout the franchise, with the title of the movie clearly stating the inclusion of hope as an important theme. With white being a colour that is usually perceived as representing goodness, purity and safety, it can clearly communicate hope more so than most other colours, as the characteristics of this colour are closely linked to that of hope itself. To contrast this, Darth Vader is clad in all black, with hints of red from his control panel and lightsaber communicating anger, violence and chaos. This combination of colours pushes forth the narrative of death, chaos and evil that this character represents. A middle ground between these two polar opposites would be Han Solos attire, with the combination of both black and white being prevalent in his design. This combination of black and white is directly influenced by his attitude, personality and his motives throughout the movies, tying in with his fluctuating allegiance and compassion. The Jedi, who throughout the films are known to favour nature and the humanity of people, are usually seen wearing monk-like robes that feature warm, earthy tones.
Visual References and Representations of Hope and Despair:

This slideshow requires JavaScript.


Bloeser, C. and Stahl, T. (2017). Hope (Stanford Encyclopedia of Philosophy). [online] Available at:[Accessed 12 Mar. 2017].
Bradley, S. (2010). The Meaning Of Shapes: Developing Visual Grammar – Vanseo Design. [online] Vanseo Design. Available at:[Accessed 16 Mar. 2017].
Brain & Behavior Research Foundation (Formerly NARSAD). (2017). “The Most Important Thing is Hope:” One Woman’s Story of Recovering from Bipolar Disorder. [online] Available at:[Accessed 12 Mar. 2017].
Burton, N. (2014). The Psychology and Philosophy of Hope. [online] Outre monde. Available at:[Accessed 12 Mar. 2017].
Dorne, M. (2014). Shapes and emotion. [online] art2art. Available at:[Accessed 16 Mar. 2017]. (2017). Hope. [online] Available at:[Accessed 12 Mar. 2017]. (2017). Optimism. [online] Available at:[Accessed 12 Mar. 2017]. (2016). Motivation and emotion/Book/2014/Geometric shapes and emotion – Wikiversity. [online] Available at:[Accessed 16 Mar. 2017].
Gendron, M., Lindquist, K., Barsalou, L. and Barrett, L. (2015). Emotion words shape emotion percepts.. [online] Available at:[Accessed 16 Mar. 2017].
Guyau, J. (1895). The Philosophy of Hope by Jean-Marie Guyau 1895. [online] Available at:[Accessed 12 Mar. 2017].
Hi.Stamen. (2016). The Shapes of Emotions. [online] Available at:[Accessed 16 Mar. 2017]. (2017). The Philosophy of Hope and Optimism – Hope & Optimism. [online] Available at:[Accessed 12 Mar. 2017].
Lu, X., Suryanarayan, P., Adams, Jr., R., Li, J., Newman, M. and Wang, J. (2012). CiteSeerX. [online] Available at:[Accessed 16 Mar. 2017].
Malfatti, M., Schloss, K., Albertazzi, L. and Palmer, S. (2014). Shape-to-Color Associations in Non-synesthetes: Evidence for Emotional Mediation. [online] Available at:[Accessed 16 Mar. 2017].
Munger, D. (2006). The emotion of shapes. [online] Cognitive Daily. Available at:[Accessed 16 Mar. 2017].
Wolfger, A. (2013). How does language shape the way we express emotions?. [online] Available at:[Accessed 16 Mar. 2017].
Atsma, A. (2017). ELPIS – Greek Goddess or Spirit of Hope (Roman Spes). [online] Available at:[Accessed 17 Mar. 2017].
Dreier, P. (2008). The History of Hope. [online] The Nation. Available at:[Accessed 17 Mar. 2017]. (2016). Spes. [online] Available at:[Accessed 17 Mar. 2017]. (2017). Elpis. [online] Available at:[Accessed 17 Mar. 2017]. (2017). Pandora. [online] Available at:[Accessed 17 Mar. 2017]. (2017). Elpis. [online] Available at:[Accessed 17 Mar. 2017].
Hodge, J. (2015). Star Wars offers enduring themes that appeal to our deepest selves. [online] The Conversation. Available at:[Accessed 17 Mar. 2017].
Jefferson, H. (2014). Body Language. [online] Available at:[Accessed 17 Mar. 2017].
Pham, H. (2014). 10 Body Language Tips Every Speaker Must Know. [online] Hope Speak. Available at:[Accessed 17 Mar. 2017]. (2017). Body Language | Psychology Today. [online] Available at:[Accessed 17 Mar. 2017]. (2017). Star Wars: A New Hope Themes. [online] Available at:[Accessed 17 Mar. 2017]. (2017). Star Wars: A New Hope: Theme of Dreams, Hopes, and Plans. [online] Available at:[Accessed 17 Mar. 2017]. (2017). SparkNotes: Star Wars Episodes IV–VI: Themes, Motifs, and Symbols. [online] Available at:[Accessed 17 Mar. 2017].
Times Higher Education (THE). (2002). Hope in history. [online] Available at:[Accessed 17 Mar. 2017].
Tyson, T. (2015). Can Honest History Allow for Hope?. [online] The Atlantic. Available at:[Accessed 17 Mar. 2017].
Widrich, L. (2016). The Secrets of Body Language: You Shouldn’t Cross Your Arms. [online] Social. Available at:[Accessed 17 Mar. 2017].
Zehr, D. (2015). Studying Skywalkers: Themes in Star Wars: A New Hope | [online] Available at:[Accessed 17 Mar. 2017]. (2017). Confident Body Language. [online] Available at:[Accessed 19 Mar. 2017].
Davenport, B. (2017). 9 Body Language Tips For Confidence. [online] Live Bold and Bloom. Available at:[Accessed 19 Mar. 2017].
Farnam Street. (2016). Amy Cuddy on Body Language And Confidence. [online] Available at:[Accessed 19 Mar. 2017].
Fortier, K. (2015). Exploration | The Power of Others – karine fortier ↳ design | illustration. [online] Available at:[Accessed 20 Mar. 2017].
Noel, K. (2016). 8 body language tricks to instantly appear more confident. [online] Business Insider. Available at:[Accessed 19 Mar. 2017].

Copyright and IP Law Research – HUD Assignment

Copyright and IP Law as pertaining to Interactive Media and the Games Industry:

IP stands for “Intellectual Property”, something intangible that is a result of creativity, such as a video game or movie. Copyright refers to the legal right that a person or company possesses regarding their IP, such as the artistic material associated with it and the ability to publish a game under that IP.

An important part of copyright, especially when it comes to IP and companies, are trademarks. Trademarks allow you to protect the logo of your company and game, as well as their names. When it comes to companies and triple AAA game development, trademarks are essential for the prolonged life of a series and the reputation of the company producing them. The name of a company or IP such as a game, holds heavy weight, especially in modern times. Names are brands and identities, holding sway over people’s opinions and allowing companies to illicit responses from a title alone. Many fans hold certain series dear to them, these IPs have specific identities that have been built up over time and turned into a brand of their own. Without trademark protection, anyone could create a game under the same name as your blockbuster, causing confusion among your fans and destroying the reputation of your IP. To secure a trademark, you must register it through the government. However, the process for securing copyright is quite different.

Copyright, which refers to the artistic, literary, auditory and code-related (falls under literary) elements created and expressed by a person, does not require registration or any legal process whatsoever. Instead, once those elements have been expressed into a medium of tangible quality, copyright immediately applies. You may also register a copyright for added protection and legal rights, however that is not essential.

Scène à faire is closely linked to copyright, however, this references artwork and elements that are required for something to work and are not able to be copyrighted. An example may be the handle of a door or a scoring system in a game.

Tied in with IP, copyright and trademarks are trade secrets, which refers to information that a company keeps secret. When employed by a company to work on a game or movie, you are required to sign a document called a NDA. This stands for “Non-Disclosure Agreement”, something that is put into place to ensure trade secrets are not leaked during development. This is especially important when developing new IPs, something that is extremely risky for game companies to commit to.

Patents protect inventions from being copied and stolen. The definition of an invention is rather flexible, ranging from a physical machine to a unique graphics creation software or technique. Some gaming and film production studios create their own internal software for their employees to use, such as specialised VFX or 3D modelling tools tailored towards a specific IP. These pieces of software may be patented, as well as act as a trade secret. The main issue with patents is securing them; as not only are they expensive but the classification of an invention, especially when it is something intangible such as a game mechanic, can be difficult to prove.

Attached to these concepts would be morals and ethics, with ethics being the morality that influences people’s behaviour and their perception of various activities. When applied to IP and legality, morality influences people’s perceptions of individuals and business practices. Not only is copying someone’s audio soundtrack verbatim and using it in your own game illegal, as you are violating copyright laws, but what you are doing is morally unjust. You would effectively be stealing from someone, lying and using their hard work as your own.

Another example of bad moral practices, as well as bad business practices, would be the exploitation of a fan base by a company. Including micro transactions inside a game is not illegal, but when it crosses the line between cosmetics and Pay to Win (P2W), it moves into a shady area in regards to morals. Many games, especially free to play (F2P) have fallen victim to developers becoming greedy, transforming their payment models in such a way that it forces players to fork out cash to be able to continue playing their game competitively. Now, that is not necessarily illegal, but it does reside in the ethical and moral realm of issues related to games and game development.

If you were to look at the content of games, not their payment models and in-game shops, other ethical considerations appear. These pertain more to decisions, or the lack thereof, presented to the player during gameplay. These decisions may include the option to either spare someone’s life or kill them, therefore presenting the player a moral dilemma. That is, however, a rudimentary example. More complex issues would present themselves when players are not given a choice, but are rather forced to watch their character, whom they are probably invested in, perform an unjust act. It becomes even more complex when a player is immersed in a game and has been submerged in the creation of their character and avatar, this can lead to ethical considerations needing to take place when the player is then subjected to extreme moral and ethical decisions. Video games do not cause violence, however, with the growing market and quality of games allowing the development of greater technology, players are able to become more and more immersed inside a game world. This may cause moral and ethical concerns about whether someone is able to make rational ethical decisions because of their subjection to such decisions without any real consequences inside a game world. At the moment, that does not present itself as a major issue, but with the rise of virtual reality and the increase in graphical fidelity, this may turn into a more serious concern.

On the subject of dashboards, in relation to vehicles such as cars, ethical and legal considerations need to be taken. The symbols and indicators located on a car dashboard need to be clear and readable, understandable by anyone operating the vehicle. Usually, a manual relating to the car should be located inside a glovebox or some form of storage in the vehicle. Inside that, information and explanations relating to the dashboard and the symbols found there can be accessed.

The car manufacturers need to ensure that there is sufficient information available to the driver pertaining to their vehicle so that they understand how to effectively operate and handle it, if not, damages may occur that the driver may deem the manufacturer responsible for. The accuser may support their argument with the lack of information regarding the symbols on the dashboard, saying they were not aware that it was a warning light or the meaning behind the symbol. This is where universal clarity and readability of symbols and icons comes into play. If the symbols are designed well, most people should be able to understand them, even if they have only a basic knowledge of driving and vehicles.

Similar concepts apply to game HUDs, in regards to their layout and readability. The game developers need to ensure that the player is able to access the relevant information efficiently, providing an immersive and enjoyable user experience. The developers may borrow from real life, and be inspired by it, but they must be careful not to directly copy other people’s designs. The symbols and icons used in some vehicles may be copyrighted by the company producing and manufacturing that vehicles, or perhaps it may be a Scène à faire situation, where the symbols are required for general use and operation of the vehicle. More research would then be conducted into each individual case, however, symbols such as batteries and exclamation marks are general purpose and not unique, therefore they most definitely fall under scène à faire.

Several acts and laws regarding IP, Law, Copyright, Patents and Trademarks are:

-Copyright, Designs and Patents Act 1988 (CDPA)

-Copyright Directive

-ACTA trade agreement

-Copyright (Computer Programs) Regulations 1992

-The Copyright and Related Rights Regulations 2003



BBC – What is Copyright? – Copyright. (2017). [online] Available at: [Accessed 16 Feb. 2017].

Chang, S. and Dannenberg, R. (2017). Gamasutra – Hey, Thats MY Game! Intellectual Property Protection for Video Games. [online] Available at: [Accessed 16 Feb. 2017].

Copyright. (2017). [online] Available at: [Accessed 16 Feb. 2017].

Duhaime, L. (2013). Copyright. [online] – Learn Law. Available at: [Accessed 16 Feb. 2017].

Duhaime, L. (2017). Scenes A Faire Definition. [online] Available at: [Accessed 16 Feb. 2017].

Gardiner, T. (2015). What part of board games besides the name is governed by trademark/copyright/patent law? – Quora. [online] Available at: [Accessed 16 Feb. 2017].

Greenspan, D. (2014). Video Games and IP: A Global Perspective. [online] Available at: [Accessed 16 Feb. 2017].

How to Register a Trademark for a Company Name – Small Business – (2016). [online] Available at: [Accessed 16 Feb. 2017].

Hut, Z. (2010). How closely can a game legally resemble another?. [online] Available at: [Accessed 16 Feb. 2017].

Intellectual property and your work – GOV.UK. (2016). [online] Available at: [Accessed 16 Feb. 2017].

Intellectual Property Office, (2014). Copyright Acts and related laws – Publications – GOV.UK. [online] Available at: [Accessed 16 Feb. 2017].

Intellectual Property Office, (2017). Intellectual property: Copyright – GOV.UK. [online] Available at: [Accessed 16 Feb. 2017].

Intellectual property. (2017). [online] Available at: [Accessed 16 Feb. 2017].

Margaret, (2016). IP Lawyer Training Game. [online] Open Law Lab. Available at: [Accessed 16 Feb. 2017].

Methenitis, M. (2007). Law of the Game: Copyright: What Every Gamer, Developer, and Aspiring Game Developer Needs to Know. [online] Available at: [Accessed 16 Feb. 2017].

New Media Rights, (2011). Video Games and the law: Copyright, Trademark and Intellectual Property | New Media Rights. [online] Available at: [Accessed 16 Feb. 2017].

Nowak, P. (2010). MythBusting: Game Design and Copyright, Trademarks, and Patents (US Law) | BoardGameGeek | BoardGameGeek. [online] Available at: [Accessed 16 Feb. 2017].

Quinn, G. (2011). Patenting Board Games 101 – | Patents & Patent Law. [online] | Patents & Patent Law. Available at: [Accessed 16 Feb. 2017].

Scènes à faire. (2017). [online] Available at: [Accessed 16 Feb. 2017].

Sellars, S. and Bicknell, P. (2015). Practical Law. [online] Available at: [Accessed 16 Feb. 2017].

Car Dashboard Warning Lights – What They Mean | RAC. (2017). [online] Available at: [Accessed 17 Feb. 2017].

Contractual, Legal, Ethical and Professional Issues Within the Games Industry. (2012). [online] Available at: [Accessed 17 Feb. 2017].

Jenkins, H. (2010). Ethics and Game Design: A Conversation (Part One). [online] Available at: [Accessed 17 Feb. 2017].

Mattwattsmedia, (2012). Legal, Ethical and Contractual constraints in the Media Industry. [online] Available at: [Accessed 17 Feb. 2017].

Takahashi, D. (2004). Gamasutra – Ethics Of Game Design. [online] Available at: [Accessed 17 Feb. 2017].

Victory Media, (2014). The Game Industry – contractual, legal & ethical. [online] Available at: [Accessed 17 Feb. 2017].

Branding and Likenesses Research – HUD Assignment

Branding and Likenesses Research:

Real-world racing teams, brands and vehicles do make their way into racing games, especially when the gaming industry continues to evolve at the rapid pace that it does. The evolution of racing games saw the inclusion of real-world vehicles and brands, however, the companies producing these games had to secure licences from the relevant companies before including them. The gaming companies, once the licences have been secured, work closely with the businesses and brands to ensure that they are seen in a good light. Quite a few of the businesses and brands would not charge for the licensing, instead they would take the opportunity for free branding and exposure, especially when it comes to triple A titles and developers that are able to attract large amounts of players.

Not only do game studios and car companies work closely to ensure proper branding, representation and legal rights are ensured and adhered to but they also help with the accuracy of the cars included inside the game. When collaboration with a car manufacturer is not possible, some game studios can skirt the fine line between similar car designs and likeness and copyright issues. Before the popularity and quality of racing video games exploded, opening up the market for collaborations between game studios and car manufacturers, most racing games used likeness in their own designs.

With the inclusion of real world vehicles, the attractiveness of modern racing games has skyrocketed. Gamers are now able to almost realistically experience cars that they are not able to access, such as Formula 1 vehicles and the latest Lamborghinis or Ferraris. Not only are they able to play the games using such vehicles, but these are meticulously modelled and rendered to provide an immersive and realistic experience, essentially acting as an advertisement for the relevant car companies and manufacturers. When playing with these cars, players are essentially test driving them, however, most car companies don’t want players to gain unrealistic and dangerous expectations of their vehicles. This may be the reason most car companies don’t publicly announce their licensing of their vehicles, and likeness thereof, to be used in racing simulation games.

The game companies involved in the creation of realistic racing games need to be aware of the legal constraints and implications that are involved when it comes to creating virtual likenesses of real world vehicles and, if they do not possess the required licensing, need to ensure they do not break any laws or violate any copyrights when producing these games as many car manufacturers do not want their vehicles to be misrepresented, especially without their permission.

Similar concepts apply to the use of racing teams, team sponsorship and their identities. Many high-profile racing games produced by triple A game studios may include real world racing teams, branding or similarities . Again, licensing needs to be obtained if the teams are being directly re-created, otherwise copyright and trademark issues might occur. Examples of games re-creating real world racing teams, brands and vehicles would be the Formula-1 series of games and Gran Turismo 5, where Sony Computer Entertainment and Polyphony Digital have secured licenses to World Rally Championship, NASCAR and Super GT.




Barron, J. (2014). Meet the Gran Turismo Player Now Driving Race Cars for Real. [online] GameSpot. Available at: [Accessed 17 Feb. 2017].

Branded Racing – Automakers use racing games & campaigns to engage more consumers. (2017). [online] Available at: [Accessed 17 Feb. 2017].

Formula One video games. (2017). [online] Available at: [Accessed 17 Feb. 2017].

Gran Turismo 5. (2017). [online] Available at: [Accessed 17 Feb. 2017].

IGN Presents The History of Racing Games. (2015). [online] IGN. Available at: [Accessed 17 Feb. 2017].

Sim racing. (2017). [online] Available at: [Accessed 17 Feb. 2017].

Wilson, M. (2012). How Do Real Cars End Up In Video Games? And Does It Help The Brands?. [online] Co.Design. Available at: [Accessed 17 Feb. 2017].