Little video

Portfolio page and contact us

This is my portfolio page for the Designers on Demand site and by using my grid the structure of the layout is exactly as I wanted. its a simple roll over button on either of the left arrow or right arrow fading to pink or purple. 






Once the buttons are clicked I want the image to fly into the next design. I have written about who I and my friend have had the chance to work with and I have started putting together images to put into the portfolio page of the site.

This is my contact us page and on this page I have kept the main text detail on the left like on all of my pages and I wanted to only use type on the contact us page to help even the site out. This is so the viewer isn't over loaded with flash animation. I have used the colours from the top banner in the content to keep the page looking even throughout.



The next step is to look animating my pages and making each page work without any errors.

Designers on Demand new layout and grid

This is the new, more slick looking flash site I have created for Designers on Demand. I have used pink and purple as I have found from researching lots of different designers portfolios that it isn't a colour used much. I feel the colours I have chosen have just enough impact and lots of professionalism of which I have been looking for since starting my visual designs.

I intend on making my home page animate and the image you can see in the main content area of the logo with the lines to fade in and out and animate the lines to move in and out, hopefully creating a nice feel to the site leaving viewers wanting to see the rest of the website.

This to the left is my services page. I want to make the text fade in using a button with a brief explaination of what services we offer on the left hand side of the page. I want the links to all roll over to purple from white when they are clicked on every page.

I want to keep this final layout really clean and minimal and I think it works the best against all the others I have designed and uploaded to this blog so far. Its the most user friendly of all of my designs and I now intend on designing the rest of my pages which will be portfolio and contact us.

The logo up close

Hopefully from reading my last post you will understand my logo design made for Designers on Demand.

Make myself look like an agency

As part of my brief I have to create a website which advertises myself and my work to the world. I wouldn't want to go free lance so I have decided to make a website based on me and my friend going into business together so I have came up with a name (Designers on Demand) and I intend on making this site live and going to GBBO (getting british business online) who will help to get us a business plan etc to make us into a real business. I created charatcers on illustrator to help give the site a nice warmly welcoming feel to it.

The idea of designers on demand is explained more in the screen grab above starting from "Hello". I have created a logo which I feel is quite strong and could work on a professional level. It is basically made from me being smaller in height to my friend. So the big circle making the 'O' from ON is actually a stick figure of a head with glasses on from the side view and in side the 'N' I have a smaller figure who represents me looking up at him. The glasses could also be interpreted as a mouse.

This page to the left is the about us page, again you can see from the design I have used my little illustrations to help to keep people on the site or at least to flick through it. Inside the white box is everything we can offer the public.

The portfolio page is very simular to the previous designs and the only animation would be the images sliding in and out. Each page that slides in would have its own piece of text below in the space at the bottom of the page outside the portfolio content box.

I havent yet finished my contact page but when I do I will upload it.

my grid

Here is an example of my grid which I made while designing my website. The idea is to line everything up to the same point throughout the pages to create a nice structured flow to my design.

Making my site more personal

After sitting down and looking through lots of different idea's and designs I think that I have found a layout that I like and like I said in my last post I think that I don't have enough information to have such a big looking site (looks like an agency site) So to break my site down about I have designed images to use on each page of my site that act as an enterence instead of a blank screen with useless text. 

The main content area is that big because I intend on my portfolio being the strongest part of my site which is quite obvious being a designers website but I wanted my main content area to stay there throughout my site.  

From previous posts I wrote about having a tool box to show what programs I can use to a professional level. Instead of taking up unessessary space on my site I have put the tools at the bottom right of my screen.

This here is my portfolio page and I feel it is my strongest page on my site, which I intended from the start. I want the design which you can see from the screen shot to fade out into my first piece of work to fade in and in the box which says portfolio I would have text explaining each project in abit of detail.

contact me

Here I have designed my contact me page with a very simular contact enquiry box to one of my original designs on an earlier post. Again it's simple but this design is starting to make me see that I don't have enough information to put on my site so instead of putting the enquiry box that I won't be able to have active I am going to add designs which act as an enterence to each specific page. As you will see from my next post very soon.

Alternative to my last idea

I have kept the same kind of layout to my last design for this one but I have changed a few things around like the logo to the left is much smaller and I would want this to jus pop out once everything else has loaded for maximum impact for people to just see it and remember it once they have left the site. At the moment I havent created anymore pages for this idea but I have managed to put up how I want my buttons to show up. I have added the tool box feature to make my site look more professional to look at and maybe a conversation starter for people who don't know what the program logo's are there for. They are also there for potential employment so if a agency finds my portfolio they instantly know what programs I can use.

My next layout idea

This is my next layout idea that I have came up with but I have only got up to the stage of making the basic layout. This idea is more structure and nice colour than splashing things on screen. If I take this design further I would intend to use minimal flash and maybe only have work or what I do sliding out and in.

I really like the red that I have here I think it's strong enough for people to remember my site when they leave but professional enough for people to ring me.

my first design

I have managed to take the things I am learning in class time into my own website layouts and designs below is my first design which I think is quite rough and wouldn't look professional enough to work on the net.

This is my splash page my intentions would be for this page to load very quickly and the splashes of page to splat on screen and my logo be made out of the mess in the middle leaving this as the finished screen to the left. I have been quite simple with my link names so people wouldn't get confused.

My about me page is basically information I have typed up making myself look abit more professional with possibly a booklet to show more about me and where I came from all of which from a design perspective. I intend this page to start from the logo in the middle of the page the red shape to move quickly out and splat the ABOUT US onto the screen.

My portfolio page is simular to my about us page apart from the colour and the text really. I want the viewer to be able to use my site really easily without losing interest so I have kept my portfolio scroll left and right very simple.

This is my idea of the what I do page and as you can see I want every page to be a different colour where the animation is conserned. I have kept everything straight to the point on this page so the viewer can get off this page onto my contact page. Basically all my animations are going to start from the logo in the middle of the screen and splat out to the name of the page.

My contact me page is an enquiry box which I think I will change because I don't think I have the knowledge or time to create the coding for this box to work so this is just an idea at the moment. The animation on this page is the pencil on the screen flying out of the splat.

I am going to explore other layouts and designs and post them up as soon as I can.

The practice site

In the Computing B module we have been given a practice site to build which helps us to understand flash and actually put into practice a working website. I have learn't alot from the lessons so far and have took what I have learnt in class and made designs of my own from looking at lots of different portfolios on the net as inspiration.

This is a screen grab of the practice site we have been working on in and out of class. I have learnt how to make buttons and how to make them roll over buttons so when you roll your mouse over the button it animates or changes colour. 

I have learnt how to link each page up and how Flash works on levels from 0 to 2 which means everything that doesn't change so the main layout of your site stays on level 0 and anythiny that changes from page to page like text goes on level 1, finally anything that is an image for example which would be on a flick through slide show would be on level 2.

Dislike this one.

http://vuletici.com/

Here is a portfolio I really dislike because I feel there is too much going on but the work produced is very nice which is a shame because I almost just clicked the red X. 

The reason being there is quite alot of work on the site and lots of links but it is quite annoying that the only way to get on the next piece of work is to click the back button on the internet browser, I also dislike that the pages have been put into circles and the background blue is an awful looking colour. So I won't be using this layout for inspiration.

Online portfolios

After looking online at lots of types of design portfolios I found many laouts and designs that I liked e.g

http://digitalmash.com/

I like how Rob Morris has created a concept from his name website name and incorporated it into his pages. He has tutorials and journal titles all next to each other creating a nice simple design. 

 When you click on them the rest fade out leaving your selected title in colour. I really like the grey used throughout the site. I can't fault anything about the website its nice and clean and the work produced by Digital Mash is outstanding.

He has worked for the likes of Coca Cola, Jay Z the rap artist and has had his work featured in magazines and design galleries world wide. His website is very clever and the use of type is fantastic.