Friday, 15 April 2011

Other two pages

I wanted to make my portfolio as interseting as it could be, whilst still making my work the central part of it. By being creative with the background etc this itself becomes an example of my work, my presentation and my skills.





1st page of my portfolio

I wanted to create a 3D feel to the page, like my models where part of the environment, not just a flat 2d image of a 3D peice of work.


1st page of my portfolio

I used my model of my head for my first page, I went back into 3ds Max to produce a render that I could use for my page, in the right setting.
here are the steps I took to do that.





Creting my Portfolio

To start with I made my front cover, I wanted to carry the theme of my cv and bussiness card throught my work. So here is the first page.


I used my different images to make my custom background. I used the tools in photoshop to create a metalic clean looking background, with added detail around the sides. And I toned the whole background to be lighter in the middle to attract the eye to whats important on the cover.


Images I used.


New and improved CV


Right, as you could see my old CV was, well BORING to say the least. I was trying to keep it clean and simple and just a bit different to the usual white paper you see. But it wasnt enough, and I feel my new CV does myself justice. I took the logo and font from my bussiness card, and applied them to a new idea and concept I have for my cv. I hope you agree that it is an imporovement over my orignial. I think it is different and striking, in a clear and consicive way, creating a different backdrop for the content that is needed, but showing my computer skills in displaying it in a different way. I used Photoshop and a great lenght of time to produce this.

Making my Cv


I used the same colour pallete/textures and typo for my cv also. Here is the second concept I made, which I was settled on but now I think I is in need of imporovement to keep up with the rest of my personal branding.

Thursday, 14 April 2011

The website - Using Flash

Here are a number of screenshots showing my progress through Flash majing the website. I have used Flash before, but never to make a website, I had to use guides and books to educate myself around the buttons controls and the scripting.

Here I am creating the buttons using the gradient tool, to create a 3d metalic looking button, and I have used a boarder on the box, and also have the text prepared to include with it.

To turn images into functional buttons requires turning it into a button, and then choosing settings of how you want it to react when and mouse interacts with it.
Flash uses many different channels and frames to build your work on, using "keyframes" which tells the program which keys will display what infomation.

This is the page with the students, which as a group we took photos of the class in the studio, and added a name tag to each one. I made these into buttons so they rediret the flash movie to the individuals webapge.


This shows the keyframes which is the structure of how flash works, there are over 110 layers used to make this website, each with different infomation on them for different webpages.

This is my individual page, and I have used a "Roll Over" system which i programed to work when the user hovers the mouse over a given image/text. There are 3 work examples, and when you roll the mouse over each of them the image of that work and a discription pops up without the user needing to click.

Here shows the initial programing of the "Roll over"
This here shows the ActionScript, which is the coding that tells the movie what to do, and act like a webpage. This coding I had to research and learn what it does, and apply it to my webpage in the correct place. This took alot of trial and error, firstly it being my first time doing this, and also tutoring myself.

Our groups exhibition design

This our design idea for the group exhibition which is called

iConcept.

Obvoisly themed around apple products, not just with the name but with the materials, colours and minimal style.

Here is a render I prodcued in 3Ds Max of the area where we are allocated for the exhibition, showing the style of displays and interativity of the design.






Interactivity -

Spinning Boards
Laptops


Website - starting with the design layout

To get inspiration for this webpage I reaserched about the theme of our exhibition which is the london underground. I looked at their webpage, advertisments they have etc and noted the clours, typos and styles of interatctivity they use.

From here I decided to make the webpage 100% from scratch and NOT use an online webpage builder, and also to use Adobe Flash to make the website, which is not the majority of peoples first choice when making a website.
Reasons being is that Flash is essentialy a constantly playing movie, which as a programer you need to tell it what to do at the right time, in the right place! This coding for Flash is called ActionScript, or javascript which you have to write by hand, there is no way for the program to write this for you, unlike html where some of the codes and actions can be worked out by the software eg. Dreamweaver. In addition to this you also still need to learn some html coding to lay the flash file or "Movie" into html format. So.. some complex things I have learnt here, mybe biting off more than I can chew in using Flash, but the possitives of using it are vast in the quality/creativity/interactivity so hopefully it will pay off in the long run with a better quality webpage.

Website

Right, I am part of a three member team that have been given the role to produce the website for the whole class's up coming exhibition. Firstly I have never made a website before, and I have no experience in writing html, or using FTP and SSL when uploading webpages. I have no idea about hosting or domain names etc either, so! quite alot for me to learn here before I even get started on designing and making this website! Lots of work ahead of me, and I will show you how I did it!

Bussiness card



This is the front and back of the bussiness card, you can see how I have applied the colour and typo theme that I decided on. I am now looking at ways to continue my branding throughout my other work, including my Cv and portfolio.

Personal Branding

To stylise myself in my personal branding I brainstormed ideas for the type of designer I am. Also through looking at my previous work I can see that I am a fairly minimalistic designer, with a hint of colour to my work also. This I think represents more joyfull, colourfull feel to my work without it loosing any professionalism.


Bussiness card

Typo; From here I designed a typo that I feel is different from the regular, and at the same time fitting in style. Using a standard font and reversing the outline, so that the font has no inner fill colour.

Colour; I wanted to combine minimal tones, with one colour added in aswell. I used this as an accent peice to compliment the subtle light tones of the main colour. I decided on a silver/grey for the main colour, possibly with a satin finish on my bussiness card. I want to use either a dn light blue/green, or pink/purple for my colour accent. Both I feel show sophistication, but it also shows a daring side, as pinks/purples are risky to use but work in the correct environment.