MySpace layout: The Mommyheads

The Mommyheads is a cult indie band from the US playing progressive, quirky, melodic, groovy pop. I made a design based on paper and scissors. I came up with the idea of making things visible by cutting through the paper, exposing what's lying underneath it, and It was a fun challenge that resulted in a nice layout. Some of the features:

• Paper cutting mouse hover effects.
• Detailed store area.
• Fully expandable layout. The headings in the holes etc is positioned automatically depending on the content

Tecniques: HTML, CSS. Apps: Adobe Photoshop, Adobe Dreamweaver, Adobe Illustrator, Notepad.

>> Open The Mommyheads MySpace in a new window

MySpace layout: Stereo Generator

Heavy, pink & blue - I really like the way Stereo Generator's MySpace turned out. I was given some nice artwork and ornaments from their new EP, 12 Gauges And Cocktails, and built the design around that just in time for their release party. While designing and coding I listened non stop to their song Berg & Dahlbana (Rollercoaster) on repeat, but now I'm finally moving on to the other songs as well and they're also pretty great. They just uploaded all of the new recordings so go on and have a listen, they've really nailed a sound that fits them perfectly.

Features:

• News section with the option of including pictures.
• All the text section editing and changing the video is easily managed by the band.

How it's made? The original MySpace structure is kept, but the music player have been moved and the left side of the profile is hidden and covered by an absolute positioned black box which is containing the newsbox and the merch section. All the regular myspace headings such as "friends" and "comments" has been hidden and replaced with large pictures acting as headings. Hover effects on buttons are achieved by placing a picture over another and letting the one on top disappear when the mouse hovers, thus exposing the one in the background. Artwork like the top image, the music player ornaments, the dirt over the video etc are all absolute positioned divs with a high z-index and background images. Tecniques: HTML, CSS. Apps: Adobe Photoshop, Adobe Illustrator, Adobe Dreamweaver, Notepad.

>> Open Stereo Generator's MySpace in a new window

MySpace layout: Alex Face

Techniques used: HTML, CSS.
Applications used: Adobe Photoshop, Notepad. >> Open Alex Face's MySpace in new window

MySpace layout: Steget

Techniques used: HTML, CSS.
Applications used: Adobe Photoshop, Notepad. >> Open Steget's MySpace in new window

MySpace layout: Honey Mustard

Techniques used: HTML, CSS, Flash.
Applications used: Adobe Photoshop, Adobe Illustrator, Adobe Flash. >> Open Huney Mustard's MySpace in new window

MySpace layout: Tony Clifton

Techniques used: HTML, CSS.
Applications used: Adobe Illustrator, Adobe Photoshop. >> Open Tony Clifton's MySpace in new window

MySpace layout: The Self-Destructives

Techinques used: CSS, HTML, Flash.
Applications used: Adobe Photoshop, Adobe Flash, Adobe Illustrator. >> Open The Self-Destructives's MySpace in new window