Now that all design decisions had been made and the aesthetic guide had been prepared and all the research for inspiration had been completed it was now time to use what I have planned and learnt to create the website during the designing stage...
The first thing to design was the loading screen, I had earlier outlined that It was necessary for my loading to screen to involve and engage the viewer of the website and wanted to do this by including some moving image and pair this with some user engagement.
The first stage for this design step that was necessary was to design the artwork of the album rerelease so that the rest of the online campaign could revolve around this and this can be seen in the top right image above. The minimal vector work, combined with the appropriate choice of colour, the traditional Chinese lettering and finally the serif style typeface all cam together to create a design of which met my specification of the balance between the historic aspects combines with the overall modern aesthetic and the fact that the aesthetics have strong link to the east asian inspiration of the music and group.
The loading screen was created by using the vectorised brush stroke in the background and creating a gif animation out of it to display what would happen what the viewer accessed the website. The stroke appears as the album loads and a percentage figure accompanies this to inform the viewer of what stage the loading was at. When the loading stage is completed the full album artwork would appear in the centre of the screen as the main focal point so the viewer knows exactly what is inshore further in to the website and finally when the mouse is moved and the centre of the design is hovered over the Chinese characters will illuminate yellow and when clicked will take the viewer to the next stage of the website. This entrance method is both memorable through its attractive nature and its user-engagability which is exactly what was desired.
The first stage of the website is the homepage and this acts as the initial stage that any viewer will access when using the website, this page like every page throughout features a top hyperlink style navigation system that allows the user of the website to navigate through the page simply. This is perfect as making the overall experience on the website as simple for the user as possible is exactly what is desired.
Due to the fact that in the brief we were informed that as a major consideration the website should be appropriate for many different global markets across many different countries and enabling this is important to ensure the album hits as many global markets as possible and furthermore increase sales of the album and popularity of the brand and to make sure this evident in the design of my website I included a system in which the language of the website could be change allowing it to be accessed by many different countries.
In the designing stage for the website the decision was made to use some of the vectorised brush stroke snakes and Chinese characters as a way to break up the page and make it less plain and boring. These aspects were only included as opaque background additions so they don't take away from he man focal information of the website. This tour page was very simple as the nature of it means that a high amount of crucial information was necessary to display and so I keep the layout very simple to improve legibility. Small accents of the iconic Wu Tang Clan yellow were used to contrast with the main colour choices of red and black to liven the page and create brand consistency with older Wu tang Clan collateral.
The next page of the website was the page in which held the photography and videography in the website. This "Watch" page contained all the consistencies form the rest of the design such as colour, background and user-engagement functions but also at the start of the page includes a fully scrolling live stream of imaged of the artist that surround themselves around the artist, album release and live shows that artist has preformed, allowing the viewer to see what the band are about and what it is like to see them live getting them involved with the over all experience of the website. These rolling images are controlled through a horizontal roll animation but are confined within a bow to a strict grid structure to further enforce the clean professional modern aesthetic.
Furthermore on the page if the viewer instead used the vertical scroll they will go beyond the photographs and encounter the video section in which they can watch examples of live performances of Wu Tang Clan. All of these user engagement enables the website to get the viewer involved and make the website memorable.
In this penultimate page the viewer will be able to listen to sneak previews of the contents of there album to the singles from he labum but not be able to download them. The minimal type needed was displayed with the audio wave style image to help the user visualise the music. The progression of the music will be displayed to the user of the website through a similar system that can be seen in other online music players such as soundcloud in which the play button is selected by the user (displayed through a small vector graphic with another along side it to function as a pause button) and a signifier bar gradually moves along the waveform as the song goes on and signifies how much of the song is played. The area of the wave form that has already played will be displayed in yellow instead of red to signify the progression to the user.
The final page includes the usual style similarities but also on top of this is the page in which on the lead up to the release of the album the viewer will have the option and capability to pre-order the album and this comes along with some special gifts that will come with the preorder such as a long sleeve t-shirt and tote bag working as a promotion and therefore encourage the viewer of the website to preorder the album and therefore gain sales even before the album is released. After the point in which the album is release this page will then turn to in to a place in which the album could be purchased.
Throughout he designing stage I considered having inclusions and links to different social media outlet in the website but in the end the decision was made not to include these aspects. The decision for this was made because of the fact that the sole purpose of the website is that of to accompany the release of the album and related aspects such as merchandise and tours in oder to boost sales of the album and I believe that if a viewer had already stumbled upon the website they must either already have an existing interest in the artist an so would be already knowledgeable of their social media presence or be viewers who know nothing about the group but if this was the case after reading about the group on the website, seeing them in the images and listening to them on the website if they still had interest in the group they would follow them on social media outlets of their own back.
No comments:
Post a Comment