Padd Solutions

Converted by Falcon Hive

Website Construction Process

Friday, February 04, 2011

.
When thinking about what I wanted my band's website to look like I drew influence primarily from Spinnerette's own website (LINK THIS) and the fact that I wanted my website to have Web 2.0 interactivity so I knew it needed to contain a forum, a community section and an option for users to create an account and log in to the website. However the first aspect of this production was to design a layout.

I began by making a 1000x1332 layout in Photoshop and added an image I am using as part of the digipak to create a connection between the two as a background for the site's banner. I added a fading gradient to the left, right and bottom sides so it blended into the plain black background (Fig. 1). I then added my artist's name, Cherry Red, in a design that I had previously created for the digipak, again to adhere to the predesignated design (Fig. 2). I chose to have the artist's name at the top because it will be the first thing a person sees when logging onto the site.


Fig. 1 & 2

The next step in my process was to add a links banner to other areas within the site such as blogs, videos, photos, music of the artist (Fig. 3). I then added a log in screen to add a Web 2.0 style interactivity to my site. It was important that this was striking enough to be noticed but not overshadow the title itself so I contained the log in box in a seperate box and filled in the two empty fields with "USERNAME" and "********" to tell the users what to input into the login section. I also included a "Not a member? Register now!" line underneath which is very common and easily allows users who would wish to log in to create an account (Fig. 4).


Fig. 3 & 4

I then planned where I wanted everything on my homepage to be located so that it was well ordered, but wouldn't be too busy. I added a section for videos down the left column (and a blank space for a twitter box which I will discuss next), a download section where I will place images of the album cover and it's single cover where users can easily click and be redirected to iTunes or a similar selling platform. I then added a section for merchandise (commonly abbreviated to 'merch' on band websites) and a section for a link to the forums. I then added a section for Chery Red's own blogs to her fans in the centre column (Fig. 5). I then added a twitter box (which would be embedded from the actual website) which would include updates from Cherry Red's official twitter account (Fig. 6). This is an extremely common practice for bands and artists these days, is used for promotional purposes and as a way for Cherry Red to interact directly with her fans aside from her personal blog on this site.


Fig. 5 & 6

Then I inserted images of the album front cover and Zombie's single cover in the Download section as I previously discussed (Fig. 7) and added an image of a male and female wearing a Cherry Red t-shirt in the merch section. This image was very easily created as I simply searched google for two people wearing blank t-shirts and this image was found presumably from a website in which users can create their own t-shirts. I then simply superimposed the artist's logo onto the shirts in Photoshop. I also added a screenshot of a standard forum as the link for the community section (Fig. 8).


Fig. 7 & 8

Next, I added images to the left column's videos section of sample videos the site would have. I included a 'Behind the Scenes' video for the shooting of the Zombie music video, the Zombie music video itself and a personal video blog that Cherry Red made (one of 9) (Fig. 9). Then at the bottom of the website itself I included a large button telling users to sign up for Cherry Red's mailing list, presumably the users would not have reached the bottom of the site unless they were actually interested in the music so this is perfect placement for people who would want to recieve emails from Cherry Red as well as just view the site. I also included a website design credit, crediting Leonhart (an internet pseudonym of mine), and a copyright for Cherry Red music (Fig. 10).


Fig. 9 & 10

The final step for the website was creating the blog posts for the main column. I wrote as the artist herself telling her fans about upcoming releases etc. and used a date line, a link to users' comments on the blog and a 'more' link to previous blog posts. The construction of the website was then complete.