Folio SheetsInterface ProjectFor this project I had to come up with an interfaces to challenge and create my own ideas for this interface by expanding it to make it noticed. Before starting with my ideas I wanted to highlight what exactly the interface requires, so as a group we started to share our ideas on What’s the definition of an expanded interface ?,What is expanded interface? and also What defines expanded interface? would be and everything below listed I took into account and really helped me to think about what it is that the interface requires so gave me an image on what I may be thinking about now.

Soon after we had did our own research on the dogma 95 manifesto we then had the role oh a participant so we had to link the dogma 95 to the role and I did my own research on what a participant is and how we can work around how we could create our role for this manifesto for it.

This is another video that I looked at to get my head around interfaces and this one was of the deepest bin where you put rubbish into the bin and makes a sound which makes people want to put more stuff into the bin to enjoy the sound.

The idea I really enjoyed and found different was how Doc in this video from “Back to the future”, he invented a cheaper and easier way of using fuel by using rubbish from the bins and the reason I think this was different and good is because the petrol has gone up in the day that we live in and people find it hard to maintain the cost of petrol. On the other hand if we used rubbish instead of petrol we would be helping to make the society more clean and enviromentally friendly and more people would use it.

Folio SheetsIdeas and sketches

My first idea was an interface on any sort of clothing top for example shirt or a jacket and it basically sends out messages off the top instead of speaking and the shirt will talk for you using its letters to express its thoughts, and also the type of mood that your in aswell which shows the colour change on the jacket. Also if you are talking on the phone and somebody is trying to ask you something to top may respond back by saying that you are on the phone or if your trying to ask a question it will give you an answer fro example if you asked what bus takes you to where youw ant to go the top will tell you as the person who is wearing the top will jow the answer and the sense the top picks up will say it on the top. So this was my first idea which I thought would have been nice to work on but at the same time I thought it would have been hard to work around so I just kept it as one of my ideas to fall back to if needed.

For my second idea I decides to come up with a chair, but it is not just an ordinary chair, its a chair that is an interface that shows whether the chair is available to sit on or it is available. For the chair to show this availibilty the chair basically goes green which indicates that you may sit on it and if someone else is sitting on it but has popped to the toilet or to get a drink or reserved the chair will go red to show that somebody is sitting there, the reason why I chose to come up with this idea is because on a day to day basis we get people who just start stealing one anothers chair and people dont really like to stand up for themelves incase it leads to a fight or something so thats why ny having a chair it wil resolve alot of problems which I think it also fun to.

For my third idea I was thinking of creating like an application on a mobile phone which pridicts what sort of day it is that is suitable for the clothing that you to go out in, this idea came into my head becasue that same day my friend came out in a jumper because he assumed it was going to be a nice day and then it started to rain and we was too far out to go back to get him a jacket so that is how i came up with the idea of this interface for a phone, so wat it does is basically you stick the phone outside so that the weather can predict what day it is and then on the app it will give you an option to what you may want to to check for example the head for a hat, body for top or t-shirt depending on what sort of day it is. I really think that this would work well and also fun to use so I am going to expand the idea of this interface.

I started to plan on my development for my idea which I want to carry out further, so firstly I thought that it would be more clear if I started to plan it out first so I started creating an option which would be 1.wardrobe which is going to be where all the clothing will be and you can also take a picture to add to the wardrobe 2. check temperature which is an indiviual device if you just want to chek the temperature 3. mix N match is just to customize your clothing.At the bottom on the image there is a thermometer which I thought I would create and clothes beside it to show what sort of weather it is to pick up and what may be suitable and i chose the body as the example s you can see in the image the thermomter as risen to reach its peak for the t-shirt.

This is the step of the t-shirt which will come up when the temperature picks out a suitable wear for the day and you can also change colours depending on what your feeling to wear and the icon on the left hand bottom side indicates the t-shirt is a medium weather.

This is an option from the wardobe which shows head, body, legs and feet and you decide what you want to pick to look at so for an example I picked head where it shows different hats from hot to cold and theres an icon where u can take a picture of a hat to add to the collection.

This is the prediction of the hat selection where the thermometer rises as you can see and has reached the wooly hat so once that is done it will go to the other parts of the body. The sketch on the right shows that the head is done and has a tick beside it and theres question marks beside the others which have no been done yet.

Further development

Folio SheetsDevelopment

I started to expand on my development by using photoshop to define and and make my interface look more clear and understanding by adding more life to it with colour.What each thermometer represents is the body, legs and hat and they are all in the form of the suitable weather for example for the body the vest is at the top to show that it is the warmest and it works itself down to cold and theres an icon to represent the colour of the thermometer(red hot, yellow medium and blue cold). So all three of these images are the suitbale wear for one another.

Icons How does it work?

You stick your phone outside or inside it doenst matter where you are and you have to wait until it senses how the day will go along so the bar will go up or down depending on the weather, and will give you options on what you want to wear but i am going to expand this by taking pictures of my own clothing to make it more realistic.So it gives you options on what you would like to wear for the day for example if its a hat weather by choosing the head it will tell you or if you choose the body it will tell you what is suitable for the body and finally for leg etc…In this image that I have created, I went through the steps of the suitable wear for the body so once u click on body the temperature comes up for the body and the next image will be the thermometer taking action by reacting and goes up to the t-shirt because it senses how warm it may be and the it will show you that this is what is best for you for the day.

Folio SheetsInfluences Youtube & websites

Youtube/website interaction shot3Youtube/website interaction shot2Youtube/website interaction shot1

I was browsing on youtube where I found a video on an interface about clothing and this is the first shot which gives a selection to what to wear.

This shot shows the outcome of the clothing he would like to pick for the day but he got help from the genie which picked it out for him.

This is the outcome of what he decided to wear, this video influenced me because it gives me a clear understanding and is giving me ideas to what to add onto my interface.

This website interaction is basically a tool which is on the left hand side which you have the power in your hands to change the climate of the weather.

This is an example when you change the weather where I dropped the temperature using the middle tool to make it snow.

Lastly I dropped the humidity which made it snow, I found this helpful because it is fun and is also interactive so others can play around on it too.

Folio SheetsInfluences/applications

I found this appliation for the I- phone ineresting because it relates to something that I may consider doing for my interface

The reason I chose to look at this application is because it has some similarities that I may possibily do and the selections.

I like the way that the clothes are presented for example the top then trousers etc its in order its clear

I also like the way u can focus on just the 1 image of clothing too so you can see how it looks.

I started to look at temperatures and how they look and react because I am going to add a temperature onto my interface.

Heres another example of the way it is showing the temperture.

I like the layout on this app because it is clear and the colours are eye catching and gives options clear too,

What caught my eye on this app was the names that are on blocks which would look good on my menu for my interface because it is basic and easy to follow.

I like how the icon is highlighted and would be good to use on my interface too, when you click the icon,

Finally another app which I can visualise how I may create my wardrobe by having a dummy there for a guide.

Folio SheetsPlanning sketches

WardrobeMix N matchOptions/wardrobe

After doing my research and getting influences from videos on youtube,applications on phone and layouts for games too which have given me a broad idea of how I may start on my sketches.Firstly I never put the title up because I was stil thinking of a name to put into my interface, and I created three options in the first box that I have sketched. The second box is the wardrobe where I havent added no pictures yet of the clothing but this is a basic layout that I was planning to think about and if you click the cross icon it gives u an option to take a picture for example the head and gives you options on what kind of hat it is and if its hot medium or cold. The last image is a drawing of the temperature and will predict what sort of day it may be.

Another option I added to my interface was mix n match which basically guides you to what you may be wearing for that day, so you wil have options such as head, body, legs and feet and once you pick either one of those items the temperature will predict where ever the meter stops which will decide what is suitable for you to wear and the clothes are on the side of the thermometer.

Finally I kind of changed the idea of the wardrobe by making it as a grid and also added the camera so it is easier to understand is clear, I also added the character on the side to give it more enthusiasm.Overall with my research I think it is time to expand on it even more by making it look more realistic and add more character to it with colour and neaten it up too, the software that I will be using is photoshop and the references for these are the examples of the layouts of the games and apps. So the next page will give you the steps on how the interface will look.

Folio SheetsProcessor/website

Roll over/highlightWebsite layoutProcessor

During the second project of the brief I did a bit of processing where I created my own sound wave using music and I found this fun to use but because this was not really relevant to what I wanted to do for my interace I left it to the side but I enjoyed the experience of using it.

This is my website and I chose to use this colour because I think that it is eye catching and also used a dark yellow for the links.I created my website using html codes where I had trouble at first to use but as the weeks progressed I really got into itbut I left my home page basic and just briefly talk about myself

I have created a roll over and the colour changes to lilac to show that you are about to click onto that link, and once you click onto it then it changes green and I found that simple to change and I played around with it in css, further-more I also changed the highlight on the text so if you was to highlight the text then it will go blue.

Opacity Hover J QueryI have added an opacity to dim the pictures and the reason I chose to do this is because I wanted people to clock on the thumbnails so see how they look

I added a hover over the opacity so that the images light up every time you put the mouse over the image.

I have added a light box to my j query to make it look more advanced and cool.I learnt alot using html and the codes and it is fun because you can play around with the codes and do all kinds of stuff.

Folio SheetsClothing-Mometer (concept)

This is my video of my concept, where I timed myself clicking on the icons to make it look like an actual app. The next image on the right is a screen shot that shows the prediction of what is suitable to wear for the day.

I enjoyed working on this project because it actually makes us think of what people do on a day to day basisi to become actual designers for interfaces. But I did have trouble thinking of how to put it so I did take alot of time on that and I could have also expanded on my interface to give it more options to what to do.In my folio I briefly explained how my interface works and why I chose to use it.

The softwares that I used to carry out my designs for my interface were, photoshop which I edited and created all my images, after effects to create the interface animation to make it look like it works and finally premiere where I used my phone to add the animation onto and made a concept video to show how it works.

Softwares Video concept Overall