by clicking on the folded edge tab, you switch face parts to someone else (but only for that row.) by clicking the main photo area, you open the content page specific for that catagory, to view photos larger or read the personal information.
if you notice now, the box is aligned right as it slides in from that direction when a category photo is clicked. the space is wider to show more of the photos, and the box edge is now not a blinding white, but a softer gray. instead of the category name and what the photo is of, there is now a brief sentence describing what the photo is/how it relates to the category.another new thing is the transparent black box under the information layer- it's now a lot more transparent so you can still see a lot of the background flipbook. adream mentioned adding a soft dropshadow under the top layer so it looks offset a little more- it's subtle, but it is indeed there to add some more of the dimensionality.
finally, the personal information page has gone through its own slight changes. mainly, categorizingthe information so that it lines up into the 1/3 proportion found throughout the layouts. also noted is getting rid of the white box with the red x in it- this was too obvious and not integrated enough, so now it's the same soft gray color as the text and box edges, and instead of an 'X', it's a carrot to symbolize sliding the box back to the right to close it.
now some questions/suggestions from the other groups...
-should the transparent box between the main layer and the subpages be colored instead of a transparent black? as in, information would be a neutral blue, loves could be soft red and hate could be a dark green? all of them would be transparent as the middle layer is now, just not black.
-should there be a directions page or an area that explains the two different things meant to happen in the interactivity?
-any suggestions on the category names on the main page?
thanks for looking and commenting!
13 comments:
For your main page, maybe you could try an icon or some sort of symbol. Or even a transparent symbol could appear on a certain section on roll over that way your images could take up the whole screen.
On your second page, to answer one of your questions I say that the transparent box should definitely be a different color other than black, and also correspond to the certain section that they are viewing. That would solve a lot of potential confusion and keep users from getting lost. I would also make the name of the person a lot bigger/legible Since now its hardly non-existent. You could even place it vertically on the left side since you have some space there. As a user, I would want to know who this person is before I read all about them.
In response to your questions:
I would definitely color the boxes for each category. It will reinforce the point of the project without directly telling the user through mundane, written, directions that if put there, most likely people would skip over them.
Also, for your icon semantics, I would suggest going back to the "x" as opposed to the carrot. Since you have to click the photo for the box of information to open, (not go to the side and pull it out) the "x" reinforces that the screen can only be accessed when the user clicks on one of the original three rectangular images.
Good improvments since the critique...the outline color changes make a big difference!
I think that coloring the boxes would be a really good idea...easier for the general public to distinguish each section. I like molly's point that this would be a better way to do it than using words.
Maybe on the first page a box comes up for a moment, or when you rollover the different parts the directions show up in a floating box just so it is more clear what to do.
I think that the categories on the first page explain each section enough and I like that they mimic each other.
Fantastic job...loves it!
Even though its mostly just tweaks, I already think this has improved a lot. I understand the dog-eared page but I think forward and back arrows might be more successful, and you might make them pulse so they are noticeable next to the large images. The need to click the image might need to be pointed out too. On the second page, I think the sliding in is much better and I agree with Molly that an "x" would be better than "<" .
Coloring the drop shadows would help add interest and understanding to the items. It would also help bring out the dimensionality even more now, allowing the color to break the two layers.
I have to disagree with the others about the "x". The arrow facing the right to show interaction was a smart move. That really shows that the menu can be moved off now to the right, instead of just closing it, especially since an "x" usually appears in the upper right to close them. I understand Molly's thoughts however with the menu sliding in I think it would make sense to give the user an opportunity to "slide" it off.
Was also interested more in how the images of the face would dissolve from the screen. Would they just appear over each other, cross dissolve, slide off, slide up? A sliding like we see int he other menu may help tie things together? SOmething to investigate.
Bonjourno!
My little suggestion would be to make your face slightly less transparent. I really enjoy the map and eye section, but the top of the head sort of bothers me.
I really enjoy the structure overall... I think it's well grided, and the information appears in a reasonable and clear way. Kudos!
I'm really happy that you made the border slightly darker on some of the information boxes, it looks much nicer with the gray border instead of the white.
a couple of quick suggestions/coomments...
I think a lot of nice changes...
1. i like the softer gray outline for the box...less overpowering.
2. the more organized information is also a big improvement.
3. I personally like the drop shadow...adds a lot of dimension without being too "collage-y"
as far as making the drop shadow different color...can't say without seeing it first...it is an interesting idea and it is always a great idea to use color as a supplement to the navigation/organization...
if the shadow doesn't look right...perhaps in the box itself?
4. titles...define, love and fear?
5. not a bad idea to explain the interface...an intro of a sort.
keep up the good work.
a
I think color coding the background would be good. It would look more interesting and make it easier to use.
I don't know about the carrots because you're already using the double carrots like bullet points. It could be confusing. If the right carrot makes something close, it makes me thing the left carrot should open something.
This might be difficult, but what if instead of a directions page you had something like alt tags that would pop up a short explanation if someone kept the mouse over something for a few seconds. I don't know if it's really necessary though, this seems to be pretty easy to figure out as is.
- I like the look of the transparent black. I'd have to see the other colors, but I think the black is working
- I think there should be some kind of cue cause those little page folds are kinda hard to see and they aren't really prominent. Maybe when your titles appear they could bounce and overshoot their final position before going to where you have them to guide the user's eye to them.
- It could just be the ampersand but I'm not feeling the titles too much. Maybe the "& is" just looks awkard. I think it might look better with the word spelled out. With the ampersand it kinda makes the categories seem like two distinct emotions? To me I think they are separate but I think spelling "and" out would be a better catch all.
Overall, the content and navigation seems pretty tight though.
I like the way in which you made the information/photo window cover only part of the backgroung image. I think it would be nice to have an explanatory page, because this sort of interaction/navigation is innovative, therefore the viewer will not automatically understand how it functions.
i dont know if i just missed this cause i read your comments really quick, but how would the black info box appear? i think the type of transition for this information box would either hurt or help your design. does the information become available when you make a match on all three faces? adding some dropshadows might add some dimensionality to your design because it is so dark. adding small bits of color could help areas of interest pop.
To your questions -
1. I dont think the transparent layer should be color tinted - I think that might look strange or distracting with the photgraphy underneath. Also, you dont want to distract too much from the information currently being viewed. I would suggest keeping it black, but perhaps add color coding in a different way... maybe a small area of color in the content page.
2. Unless the directions are kept extremely short, people will likely ignore them and try to figure things out themselves. I know I dislike having to read about something before I get to use it.
3. Perhaps simplify the categories to "What: Fear", "What: Hate" etc.
Post a Comment