Reflection On My Solutions

The brief for this assignment was to develop a space for a user to navigate through. I came up with three ideas:
Navigation through motion
A physical environment
A different metaphor
Here I'm going to be reflecting on my ideas, looking at their strengths, weaknesses, limitations and potential of how they could actually be used out in the real world.
The navigation through motion idea is based on a mix of things from what I saw in the films Minority Report, Wall-E and Gamer. As seen in the clip I posted on my blog from Gamer, I had this idea that a room could have information projected on its walls, and you can sort through it with voice commands and hand gestures.
I found this idea to be very sophisticated in the technology behind it. I think it would be very fun to use. Touch screen already exists with some mobile phones, but they haven't explored the z axis as much. My idea is that the information can be everywhere, even behind other information so you have to dig through it to pull it out. This idea will give designers the chance to design new interfaces to work with this new way of navigating. The third dimension can be explored and experimented with more, which is definitely where things like web design is heading towards. I didn't actually demonstrate using voice commands in the video, but that could easily be added to this idea, meaning that navigating can be made more fluid as you call up some programs and start using it with your hands. There are so many things out there at the moment using motion sensors such as the Nintendo Wii and it's even being used in some cinemas lately. This idea is just taking all the technology available at the moment and taking it a step further.
Having a space like this can change the way games are played, how the internet is used and how any work using a computer is done. It doesn't have to be used in a room like my example, but also on any other household items such as:
Televisions – how you can browse through channels with the Sky/Virgin/BT interfaces etc.
Mobile phones – the general way they are used and how the internet can be browsed.
PCs – how any software can be used. You could use Illustrator, but instead of using a graphics tablet, you could use your hands in front of the monitor.
The weaknesses to this idea are that it would be quite expensive, especially on the scale of the room I was using in my video, which would restrict the selling market and limit the amount of people that could buy it. Then again, a lot of things are expensive when they are first released like the iPod for example. Not everyone had one, but because it became very popular and such a trend more people were saving up for them and the prices eventually came down. The same could happen to this idea, if it becomes popular enough. For now, I don't see it happening on such a scale as a whole room being used, but the potential is there certainly to further develop things on the mobile phone front.
The physical environment idea was to follow on what Techniquest and libraries allow people to do. By using the idea of showcasing someone's work, a room could be set up full of that persons work and people will be allowed to wander around the room and browse at their leisure and physically get to look through the work. Instead of having a portfolio website, it's more like a gallery. Where a website would have a page showing pictures for example, the room will have an area with images on the walls, or perhaps folders which people can pick up and look through themselves.
Its strengths are that it is a lot more personal, being so close to someone's work. You can have the environment anyway you like it, but I chose a very comfortable one. If people could sit down, maybe have a drink and look through information this way, it may be a more enjoyable experience. It gives a very relaxed atmosphere and is a very leisurely approach to navigating through space.
The downside to this is that it won't be accessible to everyone because they have to be able to travel to the location of where the information is being displayed. This will limit the amount of people who get to look at this information. However, if this becomes quite a popular method of seeing information, then maybe more of these 'galleries' could be set up.
A better way to make the information that the room would be showing more accessible would be to put it on the internet. A digital representation of the room could be made, where the user can still navigate round the room to where they want to go. It could be set in the first person, keeping the user more involved as if they were really in the room. This is a known metaphor, but it is one that works.
The different metaphor I came up with was based more for children because it's based on a children's game, which has had many different names such as 'salt cellars', 'fortune tellers' and 'cootie catchers'. The idea of the game was that someone had to pick a colour that was on the outside of the object. Using the number of letters in that colour, the object would then be moved that number of times. Wherever it stops, there'll be a set of numbers to choose from. After moving the object the number of times chosen, wherever it stops that time the person chooses another number and the panel with that number gets lifted, revealing some information. In the children's games it could have been silly things like who they would end up marrying, or some other kind of fortune. That information can be changed to something more educational for example.
I would have created a basic Flash example of this which could have been interacted with to accompany my explanation, but I came across some problems with Adobe not being able to read the video file format I'd recorded some footage in. I did convert the files to other formats but that still didn't work and I wasn't able to re-film the footage in time.
However, the potential of this idea is quite large because it is based on something children can relate to and be interested in. It would help make learning a bit more fun and enjoyable. It's a metaphor that hasn't been used before on the net, especially as an interactive educational programme. The object doesn't even have to be made digitally. A physical construction that the children can pick up and use might work even better for them. Teachers could decide what information can be put on them and easily make them themselves.
If this was used for educational purposes, there maybe a limit with how many different subjects can be taught with this idea and and a limit to how it's used. If there's only one way to get certain information then it may get a bit tedious and boring for the children to use. It would need to be tried and tested.
This idea would make a nice little widget though if it was taken back to its original use of telling someone's fortune. It could be a popular application on Facebook or for things like the iPhone. The structure of it could even be used to make an interactive website.
These ideas aren't necessarily a huge break through in design and development, but do have the potential to be popular and a little bit different. The future is always looking for something to build on or newer, more interesting ways of doing things.

My Solutions

Here are my solutions to the brief. They have been compressed so they can be loaded and played easily:

Navigation Through Motion


Physical Environment



New Metaphor

Developing My Visual Solutions

To create the 'room' I had imagined and have someone moving information around the walls, I filmed someone infront of a greenscreen making some hand/arm movements. That way, when it came to editing I could make it appear that the person is in the white room I had imagined and I could add the information around them and make it move to match their movements.



I used the skills I'd already demonstrated earlier in the blog in After Effects to create the short film clip.


For the fortune teller based idea, I filmed a couple of outcomes of what someone could pick and then in Flash I created some buttons and linked them to the relevant movie clips. So when someone would click on a colour for example, an event would be activated which would go to a keyframe where the right movie clip for that colour is and play it. The person then sees the fortune teller move around the correct number of times. The same thing happends when a number is chosen and then when the final number is chosen an image of the information behind one the pannels will be shown. For this project I didn't film every single outcome because that would have taken too much time.However, when it came to actually using the footage I'd recorded, none of the Adobe packages could read it, even though the file format was just a normal AVI. I tried converting the file to other formats but nothing worked.


The idea for having a room which you could walk around to see what ever information you wanted was created in Photoshop. Just a simple image to show someone using things and getting information from different things in different ways.

Donis .A Dondis - A Primer of Visual Literacy

This book was on the reading list for this module, so naturally I took it out to browse through. It touches on the basic elements of design and with visual communication. Key features I looked at were:
- Contrast and Harmony
- Composition
- Symetry
- Style (Expressionism, Classicism, Embellished, Functionality)
- Function and Message (how to get the two to work together to get a good working design)
- What a visual message is made up of

These are all alot of things I've looked at before, but this has reminded me of the many ways all these things can change the look and feel of your work and change the meaning of the message you're trying to send.
I didn't read the whole book, mostly chapter summaries and alot of examples, which was what I liked about this book. There were alot of visual examples where you can see what Ms.Dondis was talking about put into practice so you could easily follow on from them and create things yourself to those specifications.


Donis .A Dondis
A Primer of Visual Literacy
1973
MIT Press
0262540290

My Ideas

From looking at existing websites and ways to navigate through information I've come up with a couple of ideas which I will be constructing into short visuals.

My first idea was to follow on what Techniquest and libraries allow people to do. By using the idea of showcasing someones work, I will set up a room full of that persons work and people will be allowed to wander around the room and browse at their leisure and physically get to look through the work. Instead of having a portfolio website, it's more like a gallery. Where a website would have a page showing pictures for example, the room will have an area with images on the walls, or perhaps folders which people can pick up and look through themselves.

My next idea was based more for children because it's based on a childrens game which has had many different names such as 'salt cellars', 'fortune tellers' and 'cootie catchers'. Here's an image of it:
The idea of the game was that someone had to pick a colour that was on the outside of the object. Using the number of letters in that colour, the object would then be moved that number of times. Wherever it stops, there'll be a set of numbers to choose from. After moving the object the number of times chosen, wherever it stops that time the person chooses another number and the panel with that number gets lifted, revealing some information. In the childrens games it could have been silly things like who they would end up marrying, or some other kind of fortune. That information can be changed to something more educational for example. A flash website could easily be created using this, where the user selects the number or colour they want, then a movieclip will play showing the object moving, eventually revealing some information.

My last idea is based on a mix of things from what I saw in the films Minority Report, Wall-E and Gamer. As seen in the clip I posted from Gamer, I had this idea that a room could have information projected on its walls, and you can sort through it with voice commands and hand gestures. It would be like what can be done with some mobile phone applications, but on a larger scale. It would be a development in the way user interfaces can be made 3D and explored. I could show examples of this being used on normal projectors, PCs and mobile phones.

My notes of ideas and planning:

Research and Inspirations

In previous posts I have shown some research into existing ways of navigating through space, mostly in web design. Here I am looking at other ways we navigate through information.

A very common way of moving through information and picking out what you want, is going to the library. It's split into sections so you can make your way around and easily find what you want.

Here I am looking at Techniquest, an educational charity aimed to educate people about science. I picked this place because I remember how good it was when I visited when I was younger. It was a fun experience that got me to learn new things. It is full of little exhibits, each with a different level of interactivity and interface to navigate with. You can wander around this large building, stopping wherever you want.

The film Minority Report was a big inspiration for my main idea on this project. During scenes where Tom Cruises character is searching for information on futuristic computers, he navigates them by using his hands to make gestures, some similar to our touchscreen devices today.



The disney film Wall-E had some scenes in it where people could control things using voice commands. Even though we've had speech recognition technology for years, if it could be used on a scale as big as this, it would change the way we can navigate through things such as websites drastically.

Another film that inspired me was Gamer. It's set in the future and there's some scenes like the one shown below where a whole room is basically connected to everything. There's things like social netwokring sites being show, games being played and video calls, which are all being controlled with voice commands and hand gestures.

Photoshop To After Effects Continued

This week I was shown how to add shadows to objects in a flat photo using After Effects. Then I was shown how you can create a fake 3D environment out of a photo using the vanishing point tool in Photoshop and After Effects. The vanishing point tool allows you to create a 3D net over a flat image and then export that into After Effects where it can be used as any other 3D object. From the example you can see that it appears that the camera is moving down the street, rather than just zooming in and enlarging the image. This is a quick trick to make a 3D environment out of a photo if you're unable to actually go out and film a certain shot, or to just demonstrate ideas.

The original image:


Video:





Here's the instructions used to create a shadow: