Stocktips were looking for a clean, professional and engaging WordPress driven blog with an emphasis on utilising social media to get their information out there and shared with the world.

The website uses responsive web design techniques to allow the website content to fit comfortably into any browser size (and mobile devices) as well as many of WordPress latest features to allow for StockTips to concentrate on their content and have the website take as much of the legwork out of content update as possible.

MoreVirbant were looking for a bright, eye-pleasing web design that utilises their brand colours as well as an easy to use eCommerce platform and Content Managment System.

The website also features community-driven areas where customers can upload images of how they use their products and get the chance to win cash for their efforts.

They are positioned to take advantage of new emerging technologies and content distribution channels to create a library of original and licensed hits that could be popular across all mediums.

The company has grown rapidly over the last few years and were looking for a website resign that would reflect their forward-thinking approach as well as show off their production values and creativity.

The website moved away from utilising Flash for animations and instead used jQuery to provide a more accessible and easily update-able layout and animation. The main navigation uses ‘fancy’ drop downs to allow customers to quickly find the information or product they’re searching for.

Each quote comes with further information about who said it, when they said it, and hopefully a interesting link to where people can find out more information on the text. Also, as a finder’s fee, contributors can include their own name and website address to each quote they add. If people like and decide to vote for their contributed quote, then they and their quote can sit pretty at the top of either the Popular Quotes or Top Contributors leaderboard.

Qwota was made using HTML5 Boilerplate, CSS3, jQuery UI,Modernizr, Quicksand plugin,WordPress, and with help from the kindly Stackoverflow community.

The logo
The logo has been redesigned as well as reduced considerably in size with the effort to convey a more established, professional brand with the juxtaposition of a bold, black sans-serif against the negative-space cut through an audio-speaker to create the ‘D’ of D-Fault. The overall shape of the logo has remained the same as to not stray too far from the established brand.

The navigation
The header of the website is to sit fixed to the top of the web-page while the viewer scrolls to allow for easier access to different sections of the website. This section includes the logo, the navigation, the navigational breadcrums and the search box. The white of the header will have an RGBa (transparency) value which will allow the scrolled content to appear subtlety behind the header. This is a feature of progressive enhancement which is not vital to the functionality of the website, but rather a nice touch for owners of more advanced browsers.

The intro
The introduction to the website has gone from ‘Hey everybody!’ to ‘We are D-Fault Records. We bring you new electronic music.’ in large League Gothic @font-face to succinctly and confidently establish brand identify as well as project the intentions of the website. There is also an arrow button to the right of the text which, when clicked will animate open using jQuery to give more information about D-Fault to anyone who requires it.

The banner
The main banner of the website features a large close up of a fictional DJ who has been awarded ‘Record of the Week’, which would be a new feature of the website, allowing visitors to listen to the new releases and vote (using the new Vote page) for the record they liked the most. This is just one frame of the banner, which could also be used to promote the latest releases, their iPhone app, or anything D-Fault required. The banner navigation is controlled by the split speaker symbol in the bottom right.

Latest Updates
The Latest Releases section and the Latest News section now have an automated system which will crop thumbnails of album artwork, retrieve only a limited number of words from the news update and apply icons for feedback and interaction such as a link to the Store page for purchase, a playback icon to listen to a snippet of the music, a ‘tweet-this’ icon, and a ‘love this’ icon which will automate the ‘Record of the Week’ feature. There are also scroll buttons to allow lots of updates to be presented without too much screen real-estate being used.

The client wanted to keep the typewriter theme from their previous website design as well as exude a retro and boutique feel, staying approachable whilst looking back the golden age of print.

Techniques such CSS3, jQuery and @font-face (a technique for using non-traditional fonts on the web) were used heavily to give the website a more modern feel.

Paperhouse Lettings were looking a simplisitic, yet professional looking website that would gain the trust of potential clients.

Techniques such CSS3 and @font-face (a technique for using non-traditional fonts on the web) were used heavily to give the website a more modern feel.

The main aim of the promotion was to get people to spread the word about my services, and this idea was reinforced by a little snippet of jQuery which allowed for my mouth to open when the user’s mouse hovered over to reveal the words: ‘Hire me, I’m really ace’, which is perhaps a little irreverent, but it seemed appropriate.

CSS techniques such as the increasingly popular @font-face was used to include custom type-faces, in this case, League Gothic available free from The League of Moveable Type.

AlbinoMosquito were looking for a website that would display the quality and beauty of their visual solutions, i.e. music videos / live visuals.

The website most the most of the WordPress Custom Fields to allow for video linkage as well as meta information such as gallery images.

Techniques such as jQuery and CSS3 were used heavily to give the website a more ‘cutting edge’ feel.

The website makes use of WordPress’s comments section to allow the artist to update their personal information, as well as quickly and easily upload any new pieces of artwork. The website uses the WordPress comments facility to allow people to give feedback and discuss the work.

The design was reflective of the dark, methodical outlining done by the artist, in contract with the often whimsical theme of the work.

NB. at the time of writing, the artist is still looking to come back and provide the required information / artwork to finish the website.

The website was the first version of the ghosthoreses.co.uk portfolio websites to steer away from the use of Flash in favour of a more lightweight, plug-in independent JavaScript framework – in this example, jQuery.

Like most of the Ghosthorses websites it is driven by the WordPress blogging / CMS software, which we’re quite fond of because of its ease to fondle with and edit in any way you choose.

Other notable features on the website includes a push to include exclude social media platforms, such as a live Twitter feed as well as a live stream for last.fm, a website for indexing the music we’re listening to.

The website makes use of WordPress’s comments section to allow the owners of the home to update their content, prices, dates, etc. quickly and easily from anywhere and uses the WordPress comments facility to allow people who have stayed at Bernisson to leave feedback.

The design was created to reflect the calming, rural and muted tones of the home itself.

The website makes use of the WordPress commenting capabilities and blends them into a custom PHP / MySQL random call out. JQuery was used to add a bit of interest to the sliding diagnoses, and CSS3 was used to style them.

I decided to base the design of the website on a typical 1970s theme, beards and all. I’m not 100% sure why.