waterscape

obviously it's in french, but whatevs. this one's not:



apparently i am now obsessed with jacques cousteau.

"from birth, man carried the weight of gravity on his shoulders. he is bolted to the earth. but man has only to sink beneath the surface and he is free."

///

& scuba sites are disastrous, as far as i can tell. plenty below, but no matter how deeply i googled i couldn't find one simple, clear, or appealing diving site. nobody seems to have taken up our idea of a lush underwater adventure/life aquatic/discovery channel documentary style. let's be the first.

///

this is an exception, though. animated GIFS for the win.

chris glass

http://www.chrisglass.com/

this guy's personal blog has a lot a lot of information on it but is so well organized that it's actually a pleasure to surf through all those links below the header (unlike...most). and the tabs at the top are so effective for navigating through his life, i'd kill to manage to keep everything so compartmentalized without feeling restrained.

obamarama

http://www.johnmccainrecord.com/
http://www.keatingeconomics.com/

more examples of obama's camp using savvy design skills beyond just the basic message to appeal to audiences. these websites, with their black backgrounds and bold typography, succeeded at intimidating me enough to either a) think that mccain is doing terribly treacherous deeds or b) think that obama is using scare tactics really well. in either case it only makes me more disheartened about politics.

now go vote!

readings / question

designing interfaces

navigation: you have to do it to get where you're going, but it's dull. less is better, and so is having it all at your fingertips (especially on the web).

possibilities: signage, environmental clues, maps

suggestions:

turn common navigational paths into single groups; keep paths short!

80/20 rule: 80% most functional displayed, 20% hidden for extra clarity

clear entry points: most uses shown–more levels for specific tabs

global navigation: consistent set of links, direct from section to section, *looking for a restroom

hub & spoke: one way in, one way out; restrict workflow to force completion of task, *good for small-screened devices like phones

pyramid: link with back and next, *slideshows, * chapters

modal panel: one page, no navigation except go or stop, force user to complete; disrupts flow, *applications, *use in web is not too feasible currently

sequence map: all pages shown in order + "you are here," linear, *numbers or titles differentiate

breadcrumbs: *home>then here>then here>current place, parent pages to present, helpful when jumping deep into tree then back out again

annotated scrollbar: tool tips, skim entire sections, signposts

color-coded sections: which part page belongs to, subtle signpost, clear boundaries, not background but maybe trim, part of text

animated transition: smooth startling place changes, more physical, natural, *mac trans, quick and responsive

escape hatch: unique to non-linear media, direct route back to home or known place, safety

///

recipe for a successful website

you need good content. there's no way around a website that's uninteresting.
fresh content is a must.
keep your message simple and to the point.
don't be afraid of making it subjective. trying to please everyone will water it down.

this short and sweet recipe suggestion is something i'll have to keep coming back to in this project, when i lose sight of the end goal and my ideal solution (which...i often do).

///

i keep wondering how we can take this scuba site and order it in a way that makes sense while not being this simple global navigation approach. in preparation for throwing that idea out the window, maybe i'll take a poll: if you were going to a scuba site, what is the number one thing you'd be looking for?

kokoro & moi

http://www.kokoromoi.com/

i often have many navigational, usability, or load timing issues with flash sites, but this is one of the best i've seen in awhile. i keep trying to show people it but forget what it is called and how i even found it in the first place. so here we go (try resizing yr browser!). and it doesn't hurt that i like their work lots, too.

late nights

constructive criticism and brainstorming sessions might just be a necessary (evil). cc, your words are wonderful.

thinking:
what you see from across the room.
what you imagine with the phrases "too cool" and/vs. "whatever"
necessary and frivolous
reversing the common depiction in black and white (change)

i have to learn how to talk. maybe that sounds superficial, like talking yr way out of a bad design, but what about talking yr way through a good one?

///

when i start being a mess just say, "hey. stop being a mess! figure it out!" nobody likes a pity party.

readings / project 1

reading 4
politics: context, client, agendas

get a taste of your client's history: with designers, challenges, successes, & decision-making methods. find allies within their team, low and high on the totem pole. make sure you know who has the final say.

create a work plan: design & client roles, process, contact info, timeline (fixed and flexible)

determine the most important audience and prioritize. what response do you want them to have: motivation? emotional? inspiration? how will they interact with the piece? what physical requirements need to be met? type of interaction, demographic concerns.

+lots of information?
alphanumeric organization: A.1, B.2.3, C.17.11
& apply system to documentation to keep info straight

find/create clarity & refinement in the content. sift through loads of info to find the relevant: market research, strategic plans, previous versions, other client materials, competitor materials, client input, completeness, message, resolution.

plan for the long run: updates, management, new material, production, budget

form = function
don't try to fit content to output or format: work logically, the other way around.

process: structure, supporting documents, information flow

+sitemap:
all project components
flowchart
coherent diagrams
navigation flow
very successful website-making tool
team consensus
framework
differentiation
hierarchy

+blueprint
+wireframe
+schematic:
less design / more structure
least & most important
order
templates for later
catalog information
quick
less style / more conceptual

///

the order of order
"THE ALPHABET, NUMBERS, TYPEFACES, TYPE WEIGHTS, DESCENDING AND ASCENDING DEELEY-BOBS, BULLETS, STARS, INDENTS, AND ON AND ON AND ON..."

why do we order how we order? when i stack my piles of papers and books in attempts at "organization," do i ever stop to think about how somebody else could happen upon these piles and make any sense of the personal associations and categories i attach to these to-do lists?

it's an exciting possibility to take something once ordered in a default way and look instead at the content for reasoning behind the default. this article very much made me think of john cusack in "high tension," where he pulls out his entire record collection, originally ordered alphabetically, and begins placing it in the chronology of his own first experiences and memories with the music. nostalgia, attachment, impressions, time periods, phases; it makes so much sense as i (and many, as the movie notices) often end up thinking about my music's history with me in this way already.

///



latest render. getting closer, finally.

small group crit:
- add more color at beginning and take all but 1 or 2 at the end to make distinction between busy busy and calm.
- possibly add more noise
- remember the point IS busy vs. minimal
- general rule of leaving type on for 5 seconds
- over contrast vs. under
- turquoise on purple is hard to read
- use a background-y sound that doesn't distract from visuals

///

agi was lovely! i've missed chicago lots. took bunches of notes, got lots of inspiration, feeling motivated but overwhelmed because am now finding myself incredibly behind (and am going to chicago again this weekend, phew). i think that if i focus reallllly hard today and tomorrow i can make serious progress in all of my classes, and hopefully that will be enough to make it through the next week or so.

!!!