Music Video
Skills Audit
Demo Work
Demo Work
Demo Work
Contents
Demo Work
Contents
> Theoretical exploration of the purpose
and application of research
> Secondary research into
music video genres, codes, conventions,
techniques, and theories
> Primary research with the
client to inform ideas development
> Focus group presentation of ideas for
feedback and review via questionnaire
survey
Moving Demo
Lin Manuel Miranda
(Unit 07 LO1 1.1)
The Lin Manuel Miranda website acts as an advertisement for Lin Manuel, displaying much of his past works.
Design
The first thing people will notice about Lin Manuel Miranda’s website is the design and colour aesthetic that is carried throughout. On each page, the header takes up the whole page. This header contains a picture of Lin, with a corresponding word and a different colour as the background of each. These headers make understanding where you are on the website easy, as well as keeping a consistent design throughout the website.
​
The rest of each page also follows a similar design with the use of a vertical scroller to help navigate each page. Each page is segmented well, with clear segments of text as well as corresponding images. The website use of colour also works really well, making each segment stand out, without the colours being too in the user’s face.
The website makes use of hyperlinks to take the user to corresponding articles, as well as a separate website that acts as a store for Lin Manuel Miranda. The article links are obvious hyperlinks however the store being a hyperlink catches you off guard as it is grouped with the menu to navigate pages. This makes the store hyperlink feel out of place with the others, which could confuse users.
The website takes good use in User forms, with a whole page being designated to contacting Lin Manuel. This page is very well laid out with an email provided for almost any way a user may want to contact them. User input is also thought of with the use of a search bar. The search bar works well and directs the user to articles or pages that may contain the information they were searching for.
Two of the largest complaints are when you look at the other aspects of navigating around the website. When scrolling down a page, a button to take you to the top of the page will appear. The button is quite small, so not directly obvious which means you have to take time to find it. One of the worst things about the website was the location of the home button. Once I had clicked onto one of the separate pages, I was left with no obvious way as to how to get back. There was no button which said home or directed back. After searching, I discovered the home button is located under the Lin Manuel Miranda name which is always in the top left of the screen. Once you know the button is there, it’s very simple to navigate home, but for first time users finding the home button can be very difficult, as there is nothing indicating that the name is even a button in the first place
Theories:
The Lin Manuel Miranda website displays a good use of the theory of CRAP. CRAP is an acronym for;
Contrast
Repetition
Alignment
Proximity
As mentioned in the design section the headers of each page display a photo of Lin with a different brightly coloured background. This example makes great use of Contrast and Repetition. The style of each header is repetitive which creates good continuity between pages, but the different coloured backgrounds provide enough contrast between each page to make them each recognisable.
​
Many of the pages also make good use of Alignment. For example the projects page makes good use of a grid structure, with each quadrant being designated to a different project. This is a good way to structure as it’s easy on the audience’s eyes but still segments its project enough to make them all distinct.
Proximity is used well mostly, similarly to the alignment the proximity of the grids work well. However, some segments on pages feel too close to each other. Not a lot of empty space is used and in most circumstances this works well. But for example on the home page, there is a slider to take the audience to different examples of his work. This slider feels quite squashed into the page, and the squashed feeling isn’t helped by the fact that many of the images in it feel incorrectly cropped.
Conventions
I believe Lin Manuel’s Miranda meets the expectations of the audience quite well. When you think of what Lin’s website would be about you’d expect it to be about his work. And that's exactly what the website provides.
​
The purpose of Lin’s website is to advertise him as a person as well as his own work. The website does this well, balancing the style and also purpose of the website. The website provides its function well, it gives information about his work, but doesn’t overload the audience with too much information, as it knows the average person will not care.
However, the information is still useful to people who are interested in film and music, as those people will be the website's main audience. The form of the website then backs this up as it provides aesthetically pleasing visuals that are easy on the eyes.
Functionality
One of the practices that Lin’s website uses the best is user friendliness. The website is easy to navigate as well as use, due to its simple design. All the buttons are simple to use and change when the mouse is hovered over them. This is a good design feature as it allows users to tell where they are on the website. Each page is easy to read and the use of colour keeps the audience engaged. The colours are used well to segment each section and also helps text to stand out.
Summary
In conclusion, I believe Lin Manuel Miranda’s website is a great example of a portfolio of work. The design is well made and all the information is essential. I want to take a lot of inspiration from Lin’s website for in the future when I evolve my own website. I’m really fond of the consistent yet distinctive design of each page and the use of colour is impressive. I’d never really considered larger entertainers having their own website so seeing this example was super inspirational and informative for me.
Hello Neighbour 2
(Unit 07 LO1 1.1)
The Hello neighbour 2 website acts as an advertisement for the game developer company as well as the game itself.
Design
The hello neighbour 2 website is quite basic but works well with what it has. The images that are displayed on the website are well laid out which allows for an easy viewing as well as being visually appealing.
​
All the important buttons such as the social media buttons and further communication buttons are always present on the website which is a good way of advertising them. It also means they are always accessible which is useful as it means the user does not have to scroll all the way back to the top of the page to find them.
When you first open the website you’re greeted by a large image, displaying the main character of the game as well as a backdrop for him. This is a good starting point as it immediately sets the tone of the game as well as the website that the user has just opened.
On the home page is also a button directing you to the alpha game, which then allows you to get in contact with the games developers which is really useful.
The aesthetics of the website are kept throughout the whole page and stay consistent with what the user is greeted with when they first open the website. This is important as it makes the whole website feel like an experience and keeping an aesthetic throughout also aids in helping the user to associate the website and keep it memorable.
Theories
The Hello Neighbour 2 website makes good use of contrast between its background and its content. The background of the website is pure black which contrasts nicely with the more eye-catching and colourful visuals of the game itself. Alignment and Proximity is also used nicely, especially in the use of displaying the game's screenshots. They’re displayed in a nice grid style, and each screenshot has a sliver of the black background in between which helps keep the proximity between each screenshot consistent.
​
The function and form of the website definitely both provide their purpose, however I would say that functionality is preferred over form. Normally, functionality is the most important but the form still has to back up the function and I feel this website doesn’t provide enough form to back up its functionality.
Conventions
The purpose of the Hello Neighbour 2 website is to advertise and eventually get the audience to purchase the game. The website does this well as it leans more on displaying the game and its functions as opposed to a heavy reliance on too much text that would bore their target audience.
​
The target audience for a game like this is going to be young to late teenagers, and this audience will not care about all the background that has gone into the game, they will only care about how the game can entertain them. And the website makers know this so they have designed the website to cater to this target audience.
Functionality
The Hello Neighbour 2 website is quite basic. But due to its basicness, its functionality is quite good. All buttons, videos and images work well. The images can be clicked on to see in a larger size which is good if any of their audience was lacking in sight, or wanted to see more detail of the image.
​
However, there are a couple of things the website could improve from. For starters it is quite a long website and there is no button to take you back to the top, meaning one must scroll the whole way up. This is a simple adjustment but would help the website. Additionally, there is a gif which looks a lot like a button, which could confuse many visitors to the website. Additionally, this gif includes a cartoon cat which doesn’t really fit the aesthetic of the rest of the website.
Summary
In conclusion, although Hello Neighbour 2 is not the best website, it is a really good one to analyse. There are many things that I will gain from this, for example I am really fond of the way the website displays its information. I had never really thought about how the background can be used to enhance the work that is being displayed. There are also many things that I noticed were wrong about this website that will allow me to avoid those mistakes in my own website, such as anything that could be mistaken as a button. Overall, the criticism and analysis of this website will allow me to further my own website going forward.
