NG1 Logo Design

Here are some logo's I've designed for the gay club in Nottingham, NG1. I've chosen quite a few variations depending on the client's requirements.

Project: Carphone Warehouse - UNI Mobile

I've finally settled on a brand new idea for my website project!

I decided not to do Saltwater, but instead the carphone warehouse. I didn't want to redesign their website, but instead offer a website that is promotion for the store in Nottingham AND as a promotion to a unique mobile phone network.

This is my initial design idea. The section with "Calla Texta Surfa" written on it is goingto be flash content.

Mini-Project - Saltwater

For our first project back, we have two weeks to create and develop a website for a retail establishment, which includes restaurants, bars, shops, pawnbrokers and dry cleaners!

I decided to create a website for the bar/restaurant - Saltwater. I've been in quite a few times so I know the environment well, it's one of my favourite bars and I think I'll be able to do the company justice through their new web design.

Their current website is online at: http://www.saltwater-restaurant.com/
As you can see, it's very basic and uses a multitude of Flash and HTML/CSS. I currently don't like their website as the design of it covers the text in some cases and the colours don't contrast enough, making it hard to read and not very user friendly.

I've looked through their website and image gallery and have begun my research for the project. These are the two files I have so far. The logo I created (first image) takes into account their current logo, but for this project, I thought I'd replicate it and produce the website around it.

KID IN A CANDY STORE: New site design

Well after having my current website online for about 6 or 7 months, I've decided it's time to give it a refresh to fit inline with my new portfolio, so that I create a new brand image and have business cards printed along the same lines.

Here is my new design for the site. It will be made in HTML and CSS as I feel my new skills in these areas will be able to create the site I want, which is an exciting opportunity for me to put my new skills into a design that will actually be used online. Also, producing the website in HTML and CSS will make it a lot easier to update and change when required, unlike using Flash, which takes a lot of time and concentration when adapting it to fit in new content.

However, I may still use Flash elements, depending on how the website forms over the coming months.

CSS Fixed and Floating - Reviewing Websites

Landau Forte
Derby Yamaha Music School
The Sims 3
Facebook
BBC

I've been looking across the Internet at how websites act and respond when the user resizes the window or maximises etc.

I looked at some mainstream sites such as Facebook and BBC and Sims 3, as well as more niche sites such as Landau Forte and Derby Yamaha Music School. My research can conclude that the way most of the sites move around are relative to a position. For example, the Landau Forte and BBC websites are positioned to be central to the screen and when the window is made larger, nothing happens, other than all the content staying central to the window.

Some sites, such as Facebook and Sims 3 are still central, but having moving objects. For example, on Facebook, if you resize the window the blue bar at the top will resize to fill all the way along the top of the site, however the whole website is still centrally positioned. The Sims 3 site also works in the same way, with the Sims 3 logo staying positioned absolutely top left, making it always visible.

Having done this research, I've decided that I am going to create my Markeaton Park website in the same style, using CSS to configure the site to be central, and remain central on resized windows.

Ill aim to keep the site's dimensions with in 800x600 to keep it accessible to a lot of monitors and screens.

Fluid or Fixed?

There's no doubt that creating a website in photoshop, sliceing it up and plonking it into a table is the easiest possible way to creating a website. However, in terms of accessibility this makes things more difficult.

My vision for the site is to be able to change text size, but I'm worried about the navigation at the top of the page. Originally I was going to use images as the links and then the image changes once you roll over to change the background colour.

To talk about these problems more and get a better understanding, I've arranged to talk to my brother who works in web design and uses CSS and HTML every day. Hopefully he'll be able guide on what would be best to do for my website.

At the moment, I'm using a fluid design which looks fixed. Once you resize the window, the whole website stays centred and the same size. I am unsure as to how to change this at the moment.

Markeaton Park Website: Initial Designs

This is the second design I've created for the Markeaton Park website.

The wireframe is on the left and shows how the generic website will look.

The new design incorporates the autumnal colours of reds, oranges and browns without the use of too much photography.

I'm not as keen on this site design as it looks very flat and basic, which wouldn't apeal to those of a more technical background.

The dual navigation bar may also be confusing, however the top bar is used to navigation across the main pages and the secondary bar is to navigate between each section of the site.

The image taken is a very good representation of autumn, however I feel I can either find another image that would represent Markeaton park better or at least show something that the user would recognise about the park. I may also include some sort of revolving gallery here.

Markeaton Park Website: Initial Designs

Here is the initial design idea I have for my Markeaton Park website.

I wanted the website to feel very much fresh and clean without over-loading the user into a frantic mess of information. To do this, I've made the background image a very clear desaturated image, not to distract from the main content of the page.

I've then used a white box overlay to create an area for the content to be based inside. This is then made slightly transparent to give the effect of glass.

On each page, there will be one main focus picture to give the user an instant preview of what the park is for and what section of the website they're in. For example, on the front page there's the main picture of the girls on the grass, then 3 photos of the places to visit at the park. The map page obviously has a map at the focal point on the page to show the visitors where things are around Markeaton.

I've used a bold thick soft font for the header so that it's clear and dominating, giving a clear introduction to each page, then the font continues to be large and clear to make it accessible to as many different people as possible.

The navigation bar at the top works as though they've cascaded out from Derby City Council logo, then the Markeaton Park logo, across ontop of the page content. Each link is the same colour, until the user hovers over one of the links and selects it. Once you're on a certain page, the colour of that link shall remain. This makes it really clear for the user to see what page they're on and also gives the website a bit more dynamic colour use, rather than having plain and flat looking buttons. I've also made these slightly more transparent to keep the weight of the website light and airy. In addition, I've included a drop shaddow to stop the site looking totally flat and dull. The effect of adding in the drop shaddow creates a feeling of distance between the main content box and the links. Therefore a flow of air could pass between the two, reflecting the air in the park and the freedom for users to travel around quickly and easily to the places they want to.

For an inital design, I'm very pleased with it and I will probably keep it.
As the project is about creating some sort of content with accessibility involve through the use of javascript, I want to create some sort of device that will either englarge the photos once clicked, enlarge the font, play a voice over or play a video. These ideas may chance one I've received the official breif.

4 Web Design Principles

Just found this interesting website. Thought those doing Interactive Media would find it quite useful for design principles.

http://www.myinkblog.com/2009/03/21/4-principles-of-good-design-for-websites/

Why Markeaton?

Other than the photo speaking for itself, why did I choose Markeaton Park for my interactive space project?

Well Markeaton Park is the place where I spent a lot of my younger years growing up. It was the park we used to go to and every time I go back I get a strong sense of memories of people I've been with and things we've done there.

Having all those fond memories has fueled me on to create a website that's accessible to children and adults so that both age groups can get the most out of the park. I want to create an environment that is useable by people with partial sight, who are deaf and those with learning dissabilities. As well, of course, as for people who are able in all those factors.

I'm going to be going back to Markeaton over the next few weeks to take photographs and pick up some information about the coming events over the winter season, so I can create this website suitable for the project.

5th Object Design

I decided to create a "visual CV" to show what I would be taking with me to New York, and to promote myself as a media supplier when I get there, as it were.

This is the first draft of the print based advertisement. I may also be taking more photos for different ad ideas and I may accompany it with a video ad as well.

My concept for the Identities project.

I’m using the New York City street as an idealistic world I would love to live in and my elements will reflect this in one way or another.


Each element will directly link to the idealistic dream and identity I’m trying to create.

Showcase – New York, where I’d love to live.

Avatar – Me, now.

Website – Shows a history of what I’ve done, taking experience with me.

Audio/Visual – Up-tempo music video, showing best bits of New York, creates an ideal image of what New York should be like, which may not be true in reality.

Logo – Speech bubble emphasises the friends and family I’ll be leaving behind.

Website and Final Ideas

Here's the initial idea I have for a website.

After deciding to choose the online environments pathway, I thought it would be a good idea to experiment with making a website on photoshop.

The website will feature a timeline in the portfolio section for all the work i've done, under the year's I did them and then include a preview of each piece and my thoughts about it.

Having done this first idea, I think i'll use it as my 5th and final identities object.

So here's my final list:

AV -40 Min D-GEM Radio Clip

Logo -Speach Bubble

Avatar - Myself, now

MY CHOICE - "Bolt" Soda Can

MY CHOICE - Profile Website

Interactive Showcase - Hiccup!

Here is the video I produced of my New York city scape.

The quality is very low and it only lasts a couple of seconds, however it took over 2 hours to render.

Having rendered this small file, I'm having second thoughts about how exactly I will go about this project. I'm going to have to create a less dynamic city scape to be able to render the images quicker. This is quite anoying as I'm really proud of the work I've done.

I'll try and keep my original idea, that you're presented with the first image and then you click a window or something and then it zooms onto that window, however it's going to be quite difficult to reduce the quality.

Interactive Showcase

After attempting the tutorial to create the building, I then applied the same techniques to create my own New York street with the same textures, which I think i'll keep if this is the idea i'm sticking to.

I love the way the light shines through between the buildings, looks beautiful. Only issue is, it will take so long to render when creating it for flash!

City Scape 3Ds Max

Here is the 3D render of my basic world so far. It's very soft at the moment due to the lack of textures. But you can see the idea so far.

Looking outside the box...

Here are a few ideas I've had for my showcase/box idea.

I love my original box idea, but that was just to play around with flash and see how it worked and how easy it was to create things. Now that I'm a bit more confident with it, I have generated some ideas that I think I could pull off fairly well.

Click the photos to enlarge and see what I've written more clearly.

Audio/Visual Identities Idea

These three photos are just an idea for the kind of shots and angles I would use for the "Lies" video. I think the angles work well, considering the tight space in the bathroom and the possitioning of the video camera will be quite difficult.

In the first photo, I would be inside the shower cubical 'flipping out' and singing along to the song. This is the same with the 3rd photo. The water would gradually turn on and soak me, whilst i'm wearing all my clothes.

The 2nd photo shows just the shower head. The idea is that there will be a close up of the shower head and the water coming out in slow motion, and then cutting to shot 3 where i'll slowly be getting wet, in time with the music also.

For reference, the song is available to hear here:

http://uk.youtube.com/watch?v=byPmV-Zbmmk

One Shot Short Ideas

We're finally coming along with our ideas. I think CCTV camera or a police car pulling someone over is quite a good idea as we'll be able to dub sound effects or music over the top to create our own versions.

I was thinking about using Family Guy sound bytes over the top of mine to create a comic video. I'll have to experiment once we've filmed our production.

One Shot Short Idea

An idea I had for the one shot short project we've been given has come to me!

My ideas are as follows:

1. The film could be from a partialy blind and deaf person, using a hazey effect on the footage and then the mubles of people talking to them. It could be filmed as if this person is lying on the floor be beaten up, or sitting in a wheel chair being patronised.

2. My second random thought could be as if the film is from a dog's point of view, sitting in its basket. The dog could be looking at us as actors doing something, and all the voices are mumbled to show the dog doesn't understand, and all you can hear is the heavey breathing, or even have a human voice for what the dog's really thinking.