>PORTFOLIO

View my personal portfolio

Websites


Project Management and Site Development


image of Real News' website

This was a group project for university, for which I was Project Manager.

Our task was to create a website and create all the content for it. We decided we would investigate the reporting of the news. We were all interested in current affairs and the way in which newspapers reported news, usually, we felt, by way of inciting panic in the public, or inadvertently promoting hatred towards minorities.

I was responsible for managing the project, and the 4 people in the team, in terms of roles and tasks.

Whilst being the project manager, I was also responsible for thebuilding the site using xhtml code and javascript. The designer in our group Tom Brierley produced screen designs in photoshop and I developed the site based on those.

You can click the image to view the site.


Company Website


branding identity created for Lifting Inspection Services Ltd

This project was for a private client

The client needed a brand developing, including a logo, flyers and business cards

This is the finished website. The client wanted to show all the services they provided, we decided the best way to show this was by way of a drop down liston the main menu.

It is very important when developing websites to incorporate the brand into the website, so site users recognise the brand and feel they can trust the webiste they are on.



Building "experience" website

image of set design portfolio

This was both a personal project and a university project.

My university project was to develop and research a Multimedia Product. My cousin is studying Theatre Set Design at Royal School of Music and Drama (RSAMD) in Glasgow and didn't have a portfolio website. So I thought this would be the ideal project to chose, since I could develop a website for my cousin, and use the same website for my project.

I decided to give the portfolio a theatre feel. I therefore designed the page to look like it was being displayed on a theatre stage. I used images from the theatre shows for the hover over links.

Click the image to visit the website.


Quitting Smoking Website

image of we can quit website

For this project I had to come with an idea for a product and research and develop it. As I was giving up smoking, I thought how an online site might be useful for quitters, and for those who have quit and simply need support

I created an online survey and got over 100 people to answer it and asked them various questions to help me understand what users would want in such a website, and if they liked the suggestions I had for it.

Based on my results, I built the website. I decided to use primary colours to give the site a positive feel, because I thought that was important in a site that was meant to be supportive.

I also had an idea about making an online calendar so the user could track their progress, and any friends or family of the user could too, with their permission.

You can click the image to view the site.

Rocky Horror Festival Website


Example Website Design This website was designed for a guide to the Rocky Horror festival. The website was designed with the existing brand image in mind. came up with descriptive words that was our ideal first impression of the website, namely risque, comical and gothic and designed the site with this in mind.

I made sure that the menu section was quite big to reflect the brand image and also so the visitor could see the menu clearly

The page was built with XHTML and CSS

You can click on the image for a larger view

Delicious Bookmark this on Delicious


Design & Branding


top


Creating a Brand Identity and Developing Media


branding identity created for Lifting Inspection Services Ltd

This project was for private client. The website was only part of the project. The client also wanted a brand identity, a logo, business cards and flyers designed.

The company was a new one and needed a brand identity developed. This included a logo, business cards, flyers and a website.

I began with brainstorming some concepts. I created a mind map showing all the associations I had with the type of company my client was. For each of these concepts I drew a series of small sketches of their logo.

I asked for feedback from the client, peers and designers to further develop the concepts, and the direction I was heading in. The strongest one, we agreed was the one you can see to the top right of the image. We felt this suited the company best because the logo portrayed what the company did. The client then decided against having a strap line, the logo and company name said it all.

I made sure that the chain was present correctly on the logo, I didn't want the chain to be an example of something being wrongly lifted!

The colours I chose were to reflect the building industry, I felt red and grey had a feel of industrial, building type companies. After the client was happy with the logo, I went on to develop the flyer design. I am particularly fond of striking typography and incorporated this into my design. The result is eye catching and to the point - "you could be breaking the law by not having your lifting equipment inspected

In both the flyer, website and business cards, I was aware of visual hierarchy, conveying the message to the viewer in a clear format, guiding them through the sections in the flyer, business card and website by way of grouping and covert visual guidance.


top


Rocky Horror Festival Branding

Concept

This was a personal project for an festival. A brand had to be developed and applied to a range of different mediums including a website, letterhead and a poster.

moodboard The concept was the crux of the project, without a concept there would be nothing to inspire any ideas. Three concepts were initially developed and the one that best befitted the image of the product was chosen.

Ideas for a concept were generated by brainstorming and asking questions such as "How does my client want to be seen?", "what's the ideal first impression of my client's brand?", "who are my client's target market and what will they respond best to?". After coming up with a few descriptive words that answered these questions, a moodboard was then created. The moodboard was made up of words, colours & pictures that represented the brainstorming words and thus the Rocky Horror Festival. The moodboard can be seen to the right.

From the moodboard the three concepts were developed, the concept chosen was "Racy".

Delicious Bookmark this on Delicious


Logo

Developed Logo This is the concept that was chosen. The logo of the tongue licking the lips was a bit racy and suggestive. Bright colours were used to tie in with the Rocky Horror's existing colours. The colours were made extremely bold and saturated which represented the brand image I wanted to portray. The logo was edited to give it a "cut-off" look to make it a bit more edgy and interesting looking.

The font family that was used was chosen because it was quite gothic and quirky looking which was representative of the brand image that being portayed. The tagline was suggestive, again representative of the brand image. This logo was then incorporated into the different mediums.

You can click on the image for a larger view


Letterhead

Branded Letterhead The letterhead had to incorporate the brand colours, red, black, white & gold. Too much colour however would render the text difficult to read. It would have been preferable to have the letterhead as bold as the brand, but to do this , it would mean making a big statement like the page background being black, which was no good due to readability issues.

A compromise was to have some black on the page but not with any text on it. A ripped effect was added to the edges of the black bands to give it a slightly tacky glamour look, matching the brand perfectly.

You can click on the image for a larger view


Poster

Branded Poster The poster was again designed with the concept in mind, the brand colours, style and font. Black was chosen for the background for the poster because it was make it stand out and appear a bit alternative. The curtain was added as a homage to the Rocky Horror Theatre shows with the text peering out behind it.

You can click on the image for a larger view


Webpages

Branded Webpage The webpages were further developed from the brand concept with the same colours, font and style. A gold gradient was used for the menu bar to reinforce the suggestion of tacky glamour. The logo was made quite big to make a bold statement and also so customers knew immediately what website they were on.

You can click on the image for a larger view

Delicious Bookmark this on Delicious

Photoediting


top


Facets - a self-portrait

In Depth Look at the Self-Portrait

This was a personal project. The aim was to create a self portrait photomontage. This meant collating different photographs together into one image and have them successful portray a self-portrait. The finished image had to look like it was real and hadn't been edited in any way. The final image is shown below.

Please click on the image for a larger version of the self-portrait together with the original pictures that went into the montage.

Flash Animation


top


Flash animation with user enabled interaction

Delicious Bookmark this on Delicious

This was done as a personal project to learn how to code a navigation system in flash.

As you can see from the flash video, a splash screen was designed and created to introduce the user to the video player. I wanted to make the animation as lively as possible to mimic the song's energy and also to reflect the brand's identity. The exact colours of the peep show brand were used for the video player background, and the peep show logo was added to the background. Peep show is known for it's unusual production style of the world seen from the point of view of a character which is why the logo is the shape of an eye. This idea was expanded upon and applied to each video in the video player screen to make them look like they were being seen through an eye. Again, this was to tie in with the brand's identity.

All the user interaction was done with coding in flash using a language called actionscript 2. The user interaction that was done via coding was the volume off button, the skip button, the play buttons, the back button and all the loading of the video clips when play was pressed.

Flash Banner Advert Animation

Delicious Bookmark this on Delicious

This animation was produced in flash. A banner advert of the shown dimensions was required for a mock Rocky Horror Festival website. Bearing in mind everything that makes the Rocky Horror Show what it is, this advert was designed and created. As you can see, it fit's in with the brand identity.

The animation was produced to fit in a 550 x 140 pixels window. This is a standard size and is used by designers and developers when designer banner adverts for websites. This advert would fit perfectly into the top section of a webpage above the menu navigation.

Video


top


Delicious Bookmark this on Delicious

The idea for this video came from the fact that I was giving up smoking and it seemed that everyone was smoking! So the idea was born. This video's production was structured into stages:

  • A script was written and a storyboard was drawn detailing the scenes to be in the video
  • From the script and the storyboard a shotlist was created. A shotlist is a list of every single camera shot that will need to be taken for every scene in a film.
  • The shotlist was followed and the shooting began
  • All the footage was then reviewed and imported in a movie editing software package
  • The music for the video was imported into the editing software
  • The footage was edited and was further edited to go with the music soundtrack, rhythimcally and also for the narrative
  • The finished film was exported to a popular format and burned onto a DVD with a DVD title menu added

3D Work


top


This object was built in a 3d software package called 3D Studio Max. The bookcase was designed and built to be as close to the original as possible.

photo of real donkey bookcase The original bookcase can be seen here and is one of only a few limited edition bookcases ever built. For more information about this original penguin bookcase, you can visit the Victoria & Albert Museum

Programs


top


Car Insurance Program


Javascript Program Example A dynamic program for a website was needed that would take a customer's details and feedback to them a list of quotations based on what they had entered into the form, e.g. years no claims discount, older driver etc. Programming was added to prevent the user from proceeding until all details had been entered into the form.

'Tooltips' were made available so that when the user hovered over certain areas in the page form, information about the details that were required from the user were displayed. When the user moved their mouse from that position, the tooltip disappeared.

All the programming was coded through javascript - a popular scripting tool.

Click on the image to try out the program

Delicious Bookmark this on Delicious

Word Tutorial


Flash Program Example A program for a website was required that would teach the user how to use some features of Microsoft Word for the Apple Mac.

The program's colour scheme was designed to reflect that of Microsoft Word's. To make the tutorial a little more interesting a game was added. The user had to navigate through the maze without touching the edges. The user was then presented with a quiz and a number of clues were given, the number dependent on how many times the user had successfully navigated the maze.

This program was built in Adobe Flash and coded with Actionscript 2.

Click on the image to try out the program