Showing posts with label WEBSITE. Show all posts
Showing posts with label WEBSITE. Show all posts

Tuesday, 15 December 2015

OUGD504 - Brief 4 - Commercial Considerations

OUGD504: Brief 4: SONY music / ONLY studio Brief

Commercial Considerations

With  my final designs for the Campaign developed I felt it was important to look at the commercial considerations of the campaign as a whole. The main consideration I found for the campaign is the viability of the full campaign, obviously hypothetical as response to the brief however in a real life context this campaign would heavily depend on budget as developing a filter with instragram would be carry a significant cost, a further commercial consideration is whether Instagram would even accept an offer to use their app as a marketing tool. 

From this I considered alternative ways in which the campaign could be feasible, the secondary route would be to develop a third party application that would apply the filter to the users photography which could then be saved and added to instragram with the custom hashtag, this would still be equally effective in terms of aesthetic however the cost of developing the third party application would have to be developed under a large budget and the adoption rate of getting users to download the app would be less effective then having it inside instragram itself. 

I considered how the campaign would operate on a low budget, this would mean users share their photography unfiltered using just the custom hashtag with the winners images then being filtered post completion for application onto merchandise and collateral. The website would be feasible to varying degrees on all budgets at the vary base level it would consist of one page that consolidate all the images from a live feed that users can like and share with a pre-order section. 

I have considered the commercial considerations of my campaign and highlighted how this could be achieved on varying budgets, demonstrating a critical insight to my design proposal and understanding of the how my design would be applied to the real word. 

Monday, 14 December 2015

OUGD504 - Brief 4 - Responding to Feedback

OUGD504: Brief 4: SONY music / ONLY studio Brief

Responding to Feedback

The critique with ONLY was a great feedback tool that allowed me to reflect on my development thus far. The guys from the studio gave me some high quality feedback that was insightful and added industry insight that I wouldn't have been aware of beforehand. Within the critique they praised the concept and the aesthetic while suggesting possible changed to ensure the site it usable and as engaging as possible to the user, from the critique I asses these suggestions and incorporated the relevant changed to be design treatment, this will ensure a more critically developed resolution that will further appeal to the user and respond to the brief. 

DESKTOP CHANGES: 

It was suggested I could make the thumbnails pop-out to avoid a very rigid fixed grid that may become un-engaging to the user when scrolling through. I agreed with this point made and when experimenting with different arrangements found spanning some images across two columns brought the page to life more making it more engaging for the user with a contrast of large and small images that would change according the amount of likes the image has. On the rollover screen I added a 'like' counter which will further encourage users to like images and makes the whole experience more interacting as the audience will actually be able to affect the aesthetic of the site collecting choosing which images to make larger. 




I also included some minor changes for example adding a home button to the navigation page to make it crystal clear for the user how to navigate their way through the site, this came off the back of feedback given from Tom saying 'treat the user like they're stupid and make it fool proof' I feel this improves that navigation of the site and will ensure anyone can navigate through the content. 


Building on feedback from the mobile site it was suggested their should be a fixed pre-order button on the desktop version of the site as currently it was only available within the pop-up and on the store page. This was a welcomed suggestion and something I had not previously considered. I used the iTunes logo in isolation to keep with minimal aesthetic as this is fairly standard and recognisable to the target audience, i added further information the supporting text to further inform the user when the cursor is placed over the download button which will work effectively on the desktop site. This alteration will link more closely to the aims of the brief which asked to achieve more pre-orders of the album of which a fixed download button will achieve. 


MOBILE CHANGES: 

With the fixed button on the desktop site encourage pre-orders, Tom suggesting there should be some supporting information available on the mobile site for the download button as it could come across as confusing to some users. This was difficult to find a balance between legibility and aesthetic as the mobile site needed to stay refined in order to keep a consistent minimal design from the desktop site, Through some further development found text similar to that on the desktop site wasn't affective or aesthetically pleasing, this lead me to create a refined icon for the mobile download, I removed the circle surrounding the music note and wrapped text around this in a similar circular shape to create consistency with the desktop site. This was the most appropriate solution as it communicates more information to the user without disrupting the overall aesthetic of the site. 



Another mobile suggestion that was a result of the critique was to increate the size of the text on the blog as Tom felt although it looked fine on a computer screen the legibility may be reduced when placed on a mobile device. I agreed with this point and increased both the title and body copy fonts, to text whether this was effective in increasing the legibility, I placed the page on my mobile device to see it in context and found that this type adjustment made the text a lot more legible than the previous type size. 



I found the critique with ONLY extremely beneficial as they brought their extensive knowledge of the digital industry to brief which was really useful as my knowledge of digital design was extremely basic. Their suggestions were informed and based on the changes I have made find the site is more successful as a result. The navigation is improved the aesthetic is more engaging and there is more information to ensure a better user experience which will make the overall campaign more successful. 

Thursday, 10 December 2015

OUGD504 - Brief 4 - Crit with ONLY: Feedback

OUGD504: Brief 4: SONY music / ONLY studio Brief

Crit with ONLY:  Feedback

Matt and Tom from only studio came back into the studio to give us feedback on the development of our campaigns thus far. Split into smaller groups gave me better opportunity for in-depth feedback that could influence any further development. I was looking forward to their feedback as it would be relevant to the digital industry and could further inform my final resolution. 

I received positive feedback regarding my concept with Tom saying it was a strong concept as it used contemporary technologies that would appeal directly to the target audience and enable a large buzz surrounding the release of the album. He liked added features such as receiving a pre-sale code for the tour when pre-ordering the album to create added value to the pre-order and a sense of urgency. Tom also commented on the use of the blog as the primary tool of keeping users retiring to the website drip-feeding the user information to keep them coming back through scheduled blog posts and content becoming available in the run up to the album release. 

I was praised for my wireframes as they were clear and demonstrated how this clearly separates the content from the design which simplifies the design process and allows further simplicity when approaching the visual aesthetic of the campaign. As we discussed the development of my campaign and visual aesthetic Tom commented on how he liked the aesthetic, he felt it was clean simple and would be easy to use. There were  a number of suggestions he commented on throughout that he felt would elevate the aesthetic and usability of the website. 

It was suggested that I add a fixed pre-order button to the website to make this option constantly available to the user similar to the button placed in the header of the mobile site. With this it was also suggested some supporting text was needed with the icon on the mobile version to clarify that it is a pre-order button. 

When looking at the desktop version, Tom suggested that I could break up the strict 4 column grid with feature 'pop out' images that would span 2-3 columns, he felt this would make the aesthetic of the homepage more engaging and break up the grid to prevent the user getting bored. Through further discussion we collectively decided that the number of likes would influence which image pop out. 

Finally reading the blog students and Tom felt there should be a clearer hierarchy of the information as although the blog title was in a different typeface they still felt this could be clearer and that there should be a home button on the navigation page even though the 'clean' logo will redirect the user to home, the group felt that a home button would make clarify this further. 
This feedback is extremely useful and I can review my development and refine the website further with these alterations to ensure the website provides the best user experience possible. I received very positive comments regarding the concept of my campaign and aesthetic of the website, with the suggested changed it was suggested this could be a great response to the brief. 

OUGD504 - Brief 4 - Mobile Feedback

OUGD504: Brief 4: SONY music / ONLY studio Brief

Mobile Feedback


Following the translation of my website onto a mobile platform I asked for feedback regarding the translation of my design across the break point and the usability of the mobile version from a range of students. I received positive comments regarding the aesthetic of the mobile site with students commenting on the continuity between the desktop and mobile site this included 'I love how you've managed to translate the original site onto the smaller smartphone, it looks great on both and you can tell they're the same website'. This was encouraging that the user could clearly identify line between the desktop and mobile sites and found the aesthetics of both equally engaging. 

I then asked students about the usability of the mobile site, The mock-ups (above) helped to articulate this demonstrating the proportions of each component within the context of the smartphone. Students were confident that the size of the components would be easily accessible using a finger to navigate the site, Innovative components such as the expanding social media buttons below the image were praised for keeping the design refined and adhering the to clean aesthetic. The type size of the body was suggested to be scaled u on the blog page which is a comment I can reflect on during further development. Overall I feel students reacted positively towards the mobile version of my website and assures me I have successfully refined the design to apply to a mobile context. 

OUGD504 - Brief 4 - Sub-pages

OUGD504: Brief 4: SONY music / ONLY studio Brief

Sub-pages

Navigation: 
Translating the navigation page onto a mobile platform was relatively simple due to the minimal design and abundance of white space. I kept the colour scheme from the desktop site and used the existing layout, centrally aligning it to the centre of the page. Similarly to the desktop site I aligned the 'x' with the navigation menu for a seamless transition between the two. The only addition on the mobile site is a direct link to iTunes and the album release date, This was applied to balance the components on the page and support the website by offering a further pre-order option. I feel this component is not invasive but more suggestive and will work effectively to create pre orders for the album. 




Blog: 
The blog needed slightly more amending to fit within the contains of the mobile device, I started by experimenting with the background, I wanted to keep elements of the pink to relate back to the desktop site however needed the white to ensure the legibility of the text. I experimented with different boarders etc however ultimately found a sloping gradient to be the most effective method of retaining the pink while incorporating the white, This creates consistency with the desktop site while remaining minimal and accessible to the target audience. 

Retaining the fixed header from the homepage ensures consistency across the site, there is a clear hierarchy within the page, with the blog title in din followed by the apercu body copy. Video will work just as well on the mobile site with a screenshot that will open out into the full video when clicked on which will make the most of the limited space of the mobile screen. 

These sub-pages are consistent with the desktop versions creating clear and consistent links across the break point and have retained the clean minimal aesthetic set out for the website. Specialist features have been taken into account such as the accessibility and usability of the site and using touch screen which requires larger clickable components and a mope refined layout to ensure the highest quality user experience possible. The mobile pages flow nicely into one another to ensure a smooth user experience that will appeal to the user well.

Wednesday, 9 December 2015

OUGD504 - Brief 4 - Mobile Homepage

OUGD504: Brief 4: SONY music / ONLY studio Brief

Mobile Homepage

The wireframes gave a good straight forward direction when starting to develop my mobile site. I used the wireframe guidelines as well as taking inspiration from the desktop site to ensure consistency across the break point. I started by using the same pantone colour palette identified in my earlier development, placing the logo in the centre will maximise its legibility and will open be the first thing seen by the user as the webpage loads down. Keeping the navigation menu from the desktop site keeps the navigation clean and minimal which will work especially well on a mobile platforms as opposed to a small compact menu bar. 

A new feature for the mobile site is a fixed direct download link in the header, The iTunes logo will be identifiable to the audience and will outsource them to the iTunes site to pre-order the album. This features removes the need for the pop-up as seen on the desktop site and development concluded this would be unnecessary and overly complicated within the mobile platform, instead the user has the availably to preorder at any opportunity with the download button fixed in the header. 



Potentially the biggest transition from the desktop to mobile site is the layout of the content within the homepage, The desktop site boast a large 4 column grid that previewed thumbnails of the content that was sourced from a live feed of the custom hashtags directly from instragram to act as a centralised home of activity for the campaign. Due the size restrictions of mobile it would not be feasible to replicate this 4 column grid on the mobile platform as it would impair the minimalist aesthetic of the site and make the content illegible due to size restrictions. I took inspiration from the instragram app which uses a one column grid to highlight the content and make it easily accessible to the user on a mobile device. Using a familiar interface will appeal to the target audience making the site more accessible and providing the user with the best experience. Creating significant links between the site and instragram will ensure a smooth transition and usable interface for the user. due to their existing knowledge and engagement of the app resulting in creating a simple grid to work from based on the templates provided by ONLY.


The desktop site fades out the image to reveal social media icons in a rollover which allow the user to like and share content to other social media platforms increasing the buzz around the campaign. Due to the restrictions of mobile it would not be most effective to simulate this rollover which allowed me to develop the social media buttons below the image for the mobile platform. The standard buttons will be simply a like button and a plus button, when pressed this will then expand into a longer list of social media links to share the content, I felt these were not essential to have shown all the time and ensures the minimal aesthetic to remain consistent across the desktop and mobile website. I have started to consider refined small details such as a simple transition fro the plus to expand which will rotate to form an x to close the expanded view, demonstrating a high level of detail into the design of my mobile site. 



To add context to the design I mocked it up onto an iPhone to view the proportions in context, I felt I had designed the homepage with suitable sizing of the components, the buttons and menus looked like they would be easily accessible with a finger touch and the images sat nicely within the frame not looking oversized or too small to see. This extended homepage simulates how the user would scroll through the content and demonstrates the email-sign up and small print footer. This mobile homepage works effectively creating continuity between the desktop and mobile site, the refined components work well together and fit nicely into the iPhone dimensions that will allow them to be usable and present the user with a positive and engaging user experience. 

OUGD504 - Brief 4 - Mobile Wireframe Development

OUGD504: Brief 4: SONY music / ONLY studio Brief

Mobile Wireframe Development

With the developed desktop website approved by students and tutors I felt confident in beginning the development of the mobile site which is an essential requirement of the brief and current web design practise. This would give me the opportunity to develop my understand of web design and how components are transformed across the break points to create a consistent web platform across a range of devices that offer the most intuitive user experience based on the characteristics of that device. 



Homepage: 
Keeping the homepage consistent across the breakpoint from digital to mobile was probably the most important aspect of translating the site onto a mobile platform as it needed to remain consistent and identifiable for the user across the platforms to assure them they are on the same website. I kept the header fairly consistent in terms of elements however centrally alined the campaign logo instead to flush left as used on the desktop site as this it more be more legible centred on a mobile device. This allowed me to incorporate a direct download link to be fixed into the header directing the user to the iTunes pre-order at any time using the website, this has replaced the popup of the desktop site as I felt this would be impractical and confusing when translated across the break point. 

Instead of the 4 column grid as used on the module site, I took inspiration from the Instagram app that uses a scrolling feed of one image to maximise legibility of the content. I felt a familiar interface would engage the target audience and allow the user the most effective experience that draws on familiar grids. Below the image are social media buttons that replace the rollover on web to simplify the sharing options making it easy to access on mobile for the user. 

Navigation: 
Due to the minimal nature of the desktop navigation page this was easily translated onto a mobile device, the only real change was the loss of white space surrounding the type and the addition of a further iTunes downlink link that is further encouraging the user to pre-order the album over multiple opportunities without being too invasive or attacking them from all angles which I feel works well placing the opportunity on each page in quite a simple fashion that adds a sense of choice for user. 

Sub-page: 
The standard fixed mobile header remains consistent to the homepage and still reflects the desktop site, the translation of the blog remains fairly similar to the original desktop design creating a clear hierarchy of page title, blog title, content that is fictional on a mobile device and will appeal to the user. 

Extended Homepage: 
Similar to the homepage this wireframe demonstrates how the user would scroll through the site and includes the footer, which is a refined version of the desktop footer with the site map, contact details FAQ and link to the desktop site. The newsletter sign up is also included with the footer to allow the user to sign up and receive updates that will keep them coming back to the site i.e. when new content is available e.g. merchandise or blogposts (Users will be automatically signed up with any purchase or pre order.)

I have found the main difference between designing for web and mobile is that mobile must be far more refined due to the smaller frame to place the content this results the the use of less white space to fill the pages. As the mobile device uses fingers to interact with the content the clickable components need to be larger that those on the desktop where typically a mouse or trackpad is used that is far more accurate and smaller, this results in a simplified translation of the desktop site onto mobile to ensure it is functional and gives the user the best user experience across devices. 

Monday, 7 December 2015

OUGD504 - Brief 4 - Desktop Feedback

OUGD504: Brief 4: SONY music / ONLY studio Brief

Desktop Feedback

With the newly refined designs for my desktop website I asked students for feedback as to whether they felt these were successful, would appeal to the target audience and provides a good user experience. I felt it was important to acquire aesthetic feedback at this stage before developing the mobile site to ensure consistency across the breakpoints. I started my presenting my concept and development thus far to a group of students that doubled up as my target audience in an informal critique. They reacted positively to the campaign saying it was 'a really cool concept' that is relevant within todays society and will certainly appeal to the target audience. When I explained the genre and band to them they felt the aesthetic of the desktop site reflected the nature of the band students said 'I really like the minimal layout, the baby pink works super well making the pictures stand out and makes a nice relaxing colour scheme similar to how the bands music makes you feel, good job'. 

When I prompted further more specific questions found they felt the typefaces were approbate and the size of the images were about right as I was initially concerned they may be slightly too large for thumbnails. Students felt the site was perfectly usable with some slight questioning of the navigation menu as opposed to a fixed bar however I feel this would compromise the clean aesthetic of the site. They especially liked the jump to the top arrow similar to that used in tumblr one student said 'I love that arrow, when I use tumblr it makes it so much easier than having to scroll all the way back to the top'. The blog was also a commented on point saying its a great way to get people to come back to the site posting updates in the countdown to the album. 

Overall the feedback I recited from students was largely positive which gives me encouragement to start to development the mobile version of the site. The aesthetic articulated itself well and connoted a relaxed ambient experience similar to the bands sound. Finally students felt the concept was well established and innovative which will said the overall success of my response to the brief. 

OUGD504 - Brief 4 - Desktop Development

OUGD504: Brief 4: SONY music / ONLY studio Brief

Desktop Development 

Homepage:
From the tutor feedback I started to refine the original designs, the main alteration for the homepage was to create a more spacious aesthetic, this was achieved by positioning the band logo vertically in the right margin as suggested by my tutor as this was a distinct unique feature from the album cover, this freed up more space in the header which I then developed further decreasing the size of the campaign logo and navigation menu. This creates a more refined aesthetic that is more subtle and less 'in your face' it more accurately reflects the ambience and relaxed nature of the band.  

Original

Refined

Pop-up:
Minimal refining was required for the pop up, Removing the bands logo allowed a more minimal design as it was already present within the album artwork, this also creates further continuity with the updated aesthetic. Refining the text with a smaller point size makes the whole pop-up less invasive and refines it to a more relaxed aesthetic allowing more white space to balance the components within the pop-up avoiding a busy aesthetic. 

Original

Refined

Navigation: 
Another page that required minimal refinement was the navigation page, the feedback was positive about the super minimal layout that complemented the overall aesthetic and directed a clear flow through the website, With the smaller header on the pages I refined the 'x' to align with the new smaller navigation menu for a seamless transition between the two. I also adjusted the kerning of the typeface to the custom kerning used within the campaign logo to ensure further continuity throughout the site. 


Original

Refined

Blog:
Updating the blog with the refined header form the homepage added to a sense of continuity flow between the web pages. Comments were made suggesting I made the hierarchy of information clearer within the blog aesthetic. I refined this adhering to the clean aesthetic applied throughout the site by changing the blog title to din creating a contrast between the titles and body copy with their different weights, I also increased the size of the titles slightly to create a simple yet subtle hierarchy within the page. I adjusted the page title to the same size as the updated logo so there there weren't too many different sized elements within the page that allowed a aesthetically complimenting layout to be created.




These refinements, although at times have felt minimal have elevated the quality of the overall design greatly. This new aesthetic feels less clunky and blocky opting for a smoother cleaner aesthetic that is minimal and tasteful with contemporary detailing that will appeal to the target audience and provides a better overall user experience due to its more streamlined and professional aesthetic. 

OUGD504 - Brief 4 - Tutor Feedback

OUGD504: Brief 4: SONY music / ONLY studio Brief

Tutor Feedback



Having digitally developed my concept into a desktop website I sought feedback from a tutor before developing the mobile platform. Overall he really liked the social aspect of my concept and felt it would appeal to the target audience. He liked the use of pastel pink as 'it really allows the boarders of the images to pop'.  Was advised to give the title some space between the start of the content as it felt a little crammed at present. He picked up on the javanese house logo positioned vertically on the album covers and as this is quite distinct and unique suggested I incorporate this into my website design, this would also free up some space allowing more space between the components. 



My tutor liked the aesthetic of the navigation and pop up pages with major changes needed. He commented on the hierarchy of the blog page saying it could be clearer defining the blog title and content as currently they blend into one another and don't articulate a clear hierarchy.  This feedback established by design as a viable response to the brief, from this feedback I will address the issues raised to ensure the design is intuitive, engaging and aesthetically pleasing resulting in a high level of development and understanding of digital design. 

Sunday, 6 December 2015

OUGD504 - Brief 4 - Sub-pages

OUGD504: Brief 4: SONY music / ONLY studio Brief

Sub-pages


Navigation: 

I planned a clean a minimal aesthetic for the website, during the wireframe development I concluded a operate navigation page would be more successful in creating a clean aesthetic as opposed to a menu bar running across the page. When designing I experimented with my colour palette and found inverting the pink background with white text from the homepage would create an effective contrast to show they have left the homepage. This colour palette works effectively highlighting the minimalist design and creating a contemporary sense of space. Aligning the 'x' with the navigation button of the homepage allows a seamless transition back and forth between the pages. The pink typography works at this point size allows the copy to still be legible however if smaller type needed to be incorporated this colour may affect the legibility. 



Pop-up: 

When the user first clicks onto the page they will be met with this pop up allowing a direct link to the pre-order, this will instantly set the tone and encourage pre-orders from the second the user accesses the site. Including the album cover will instantly engage the user and define the aesthetic that will support the content when they start to engage with the concept. The body copy describes how they can receive an unique pre-sale code for the up-coming tour to ensure a better change of getting tickets adding further incentive to pre-order the album. The tone of voice used on the body copy throughout the site is very informal and personal, signing off 'love amber & co' (amber = vocalist) creating a more personal and direct relationship with the band. 

The aesthetic of the pop up is allows it to contrast the homepage using the white from the colour palette as the background colour to ensure it jumps off the page, this also ensures the body copy is clearly and legible for the reader. The use of image within the frame will instantly catch the eye of the user supported by the 'clean' logo which is the start of creating an identity for the campaign. The pre-order button is surrounded by a box to reinforce that is is a 'click-able' component of the page. Ensuring the size of the pop up isn't the full size of the screen and showing the homepage in the background will create a clearer instruction that it can be closed to access the compare than if it were full size as this could have potentially confused users, it also creates a sense of building excitement to what is actually in the homepage giving a sneak preview to its content that is hidden by the pop-up. 



Blog: 

I found the blog sub-page slightly more difficult to design for as I wanted to keep the pink consistent yet wanted to ensure the maximum legibility of the body copy. Through experimentation I transferred the gradient from the homepage and extended it to created a central block that could be used for the bulk of the content. This worked well as it naturally drew the eye to the content and focused in on it. There is a hierarchy flowing down the page of the page title, blog post title, content, this will read naturally and ensure a direct flow of information across the page. I have used Apercu as a standard body copy throughout my distal platform as it is contemporary, neutral and legible it also complements DIN well creating a good set of typefaces that are all available as web fonts. 


These sub pages have a consistent aesthetic that will allow them to flow nicely into one another enhancing the movement throughout the site and create a more effective user experience.  The aesthetic is clean minimal and consistent with the homepage, it reflects the ambience of the band and their ethos well which will appeal to the target audience and complements the content well. I will obtain feedback based on this development and respond according before developing the mobile version of the desktop website. 

OUGD504 - Brief 4 - Homepage

OUGD504: Brief 4: SONY music / ONLY studio Brief

Homepage

Taking the grid templates only provided during the briefing gave me the basis for refining my wireframes and applying the content to the website. I took the aesthetic of the album and applied a wider margin to the right column of each image to create consistency with the album cover. Taking from the wireframes I applied the logo and created a simple navigation button that would re-direct the user to the navigation page. I created a small information box to explain my concept and the purpose of the images, this used a white gradient to ensure the text is fully legible and a closable 'x' to remove the information box when the user has read it which would slide the images up creating a full screen of thumbnails. The homepage looks minimal and uncluttered which will result in a very clear and usable experience for the user. 




Scrolling through the homepage of thumbnails will trigger a back to the top button to appeal to enhance the users experience and navigation of the site. There will be an endless scroll of the live feed which would make it impractical to then scroll back to the top of the page, the jump to the top arrow which appears in the right margin of the page will allow the user to effortlessly jump back to the top of the screen.


Hovering the mouse on top of a thumbnail will trigger a rollover fading the image out and revealing a range of social media icons that will encourage the user to like images and share them to other social media platforms such as Facebook, Twitter and their own instagram feeds, this will raise the awareness of the campaign and create a larger buzz surround the album release if the concept is consistently spread across a number of social media platforms. This will reinforce the content and encourage other users to engage with the campaign if it seen as a popular social craze. 


 I created a footer at the bottom of the page that includes a site map, contact info, developer information as well as credit card secure logos and social media icons to share the site on other platforms increasing the awareness of the site. I created a new letter sign up that sits within the footer, users are automatically signed up to this with any purchase however the option is always there. The newsletter will keep users aware of updates and encourage them to return to the site when new activation points are uncovered e.g. blog updates. They will receive emails such as 'new blog post available now click here to see' which will then redirect them to the site. 


Finally I created a scrolling mock up to simulate how the content would look in context. The thumbnails looked a good size on screen and I wouldn't want to make them any smaller as this would effect the users experience having to look more closely at every image. I am happy with the development of the homepage, it shows clear progression from the wireframes and has a distinct aesthetic that represents the band well with clear links to the physical album and style of the band. This design articulates the concept well with multiple opportunities to share content to other social media platforms and acts as a centralised 'home' for the campaign. From this I will develop the rest of the website pages aiming for continuity across all the sub-pages to ensure a good flow between these pages which will create a more successful user experience. 

Sunday, 22 November 2015

OUGD504 - Brief 4 - Website Analysis: Swim Deep

OUGD504: Brief 4: SONY music / ONLY studio Brief

Website Analysis: Swim Deep

Similarly to the Chvrches website the Swim deep website also uses an immediate pop up to promote their recently released album however this feels slightly less refined in the aesthetic. The boxes surrounding the links feel restrictive and don't add anything to the aesthetic or function. Due to the vibrant nature of the band and the high impact album cover I would have expected a slightly more creative pop up with a higher impact to be used to appeal to the target audience. 



The homepage for the website feature large scale photography of the and running on a slide  show these image will appeal to the audience and create more of an emotional connection to the band than the previous websites have thus far. I feel this will appeal to their audience making it more of a personal experience as the previous websites have be largely focused on the album and the music forgetting the members of the band and their character adds a lot to the marketing of the band as a whole. The navigation bar feels un-proportionate to the rest of the page and isn't particular engaging or aesthetically pleasing other than it doesn't take too much attention to the focal point of the imagery. 


I really liked this interactive feature within the website, the #onegreatsong playlist is a digital campaign used to promote the bands latest single. This feature is a compilation playlist created by the band of songs they think are great. This will really appeal to an audience as it again shows more of the bands personality telling an audience what sort of music they're into and find inspiring, as well as creating a personalised campaign that will promote their single. The page links to spotify without the need for outsourcing to keep the user within the website which is a nice touch to keep them on the site for as long as possible. 


The tour page is similar to the Chvrches page however find this more structured which feel doesn't work as well as the churches example, the blue filer would look more effective if it covered the full page at a slightly lighter opacity however I like the photography of a crowd giving connotations of the life performance the content is displaying. 


There are engaging features within the swim deep website that will engage the user particularly the focus on the band as people showing their character will appeal to the target audience making them feel closer to the band. The digital campaign is a great extension of this adding character to the website while promoting the bands single. I found the website as a whole could be slightly refined to make it more engaging to the user but felt there was a solid concept that worked in principle that could be really engaging with habit more development.

OUGD504 - Brief 4 - Website Analysis: Chvrches

OUGD504: Brief 4: SONY music / ONLY studio Brief

Website Analysis: Chvrches 

The first think the user sees when accessing the Chvrches website is a pop up promoting their recently released album, this shows the cover art, track listing and most importantly links to purchase the album. This is a great way to instantly alert the user about the new album and would allow them to download it straight away with no confusion trying to find it within the site. Some may call this too in your face however I feel it is bold and engaging highlighting, at the end of the day, the most important feature of the website right at the start of the users experience. 



The homepage of the website is extremely interactive using the album artwork creatively on a digital platform, the colour watched boxes from the album artwork have been utilised and transformed into the page navigation. This is a little confusing at first however when the user hovers over the boxes the text appears informing you which page this box will take you too. This element of user interaction massively improves to overall user experience of the website. 


As an alternative to the navigation within the boxes on the homepage there is also a drop down list alternative that can easily be found, this takes over the full screen which gives a bold aesthetic and a greater sense of usability without background elements distracting from the content. The centrally aligned text creates a clear social point within the page and is reminiscent of album track listing on the reverse of most albums. 


The live shows page of the website creates a sophisticated and legible aesthetic, using the background of the homepage to create continuity between the pages with a black transparency filer to focus the eye to the content and allow this to stand out in white body copy. The information fills the whole screen with even distribution making it aesthetically pleasing and easy to navigate. The social media links once again create a cross platform with other social media and can be used and free promotion for the band. 


The Chvrches website is the most interactive and provides the best user experience of all the websites analysed thus far. The engaging and immersive layout is sophisticated and will appeal to the target audience who have sophisticated internet demands. The promotion of the album from the second the user enters the website is a nice feature and there is continuity between all of the pages creating a nice flow throughout the website. The only criticism would be that is feels very refined like it would be perfect for tablets or mobiles however I would expect slightly more detail fro the desktop site.