[process] Notes on... the Web site design process

Get Started. It's Free
or sign up with your email address
Rocket clouds
[process] Notes on... the Web site design process by Mind Map: [process] Notes on... the Web site design process

1. books

1.1. Comminicating Design http://www.communicatingdesign.com/

1.2. A Practical Guide to Designing for the Web http://designingfortheweb.co.uk/

1.3. Designing for Interaction http://www.designingforinteraction.com/

1.4. About Face 3 http://www.amazon.com/About-Face-Essentials-Interaction-Design/dp/0470084111/

2. production

2.1. what is this about

2.1.1. switch to factory mode

2.1.2. well, this is just another story

2.1.3. Prevedeni konecneho navrhu reseni do podoby produkcnich sablon.

2.2. o cem to je

2.2.1. udrzovatelny kod

2.2.2. neprustrelny kod

2.2.3. nahrazovani pisem

2.2.4. HTML 5 a mikroformaty

2.2.5. CSS 3

2.2.6. progressive enhancement

2.2.7. kompatibilita napric prohlizeci

3. brief

3.1. what is this about

3.1.1. the project springboard

3.1.2. the starting point document

3.1.3. various forms

3.2. parts

3.2.1. summary

3.2.2. the problem

3.2.2.1. problem definition

3.2.2.2. designer's role

3.2.3. goals

3.2.3.1. primary

3.2.3.2. secondary

3.2.3.3. short term

3.2.3.4. long term

3.2.3.5. bussines goals

3.2.3.6. goals vs. means

3.2.4. audience

3.2.4.1. tasks

3.2.5. constraints

3.2.5.1. redesign

3.2.5.2. technical requirements

3.2.5.3. need for ads

3.2.5.4. brand considerations

3.2.5.5. current content

3.2.5.6. competitors

3.2.5.7. ...

3.2.6. deliverables

3.2.6.1. deliverables, not research

3.2.6.2. designer should choose an appropriate research tool

3.2.6.3. examples

3.2.6.3.1. personas

3.2.6.3.2. wireframes

3.2.6.3.3. code mockups

3.2.6.3.4. layout visual design

3.2.7. budget

3.2.8. timetable

3.3. context constraints

3.3.1. a single project in a few parts

3.3.1.1. sub-briefs

3.3.1.2. idea briefs

3.3.1.3. using not the same deliverables for every single part

3.3.2. timetable vs. agile

3.3.2.1. timetable not applicable

3.3.2.2. keep being keen on deadline

3.3.2.3. deliverable driven progress

3.4. tools

3.4.1. SWOT analysis

3.4.2. moodboards

3.5. links

3.5.1. http://www.jayhollywood.com.au/the-creative-brief-a-designer’s-best-friend/

3.5.2. http://www.adobe.com/resources/techniques/resources/index.html

3.5.3. http://iainstitute.org/tools/

3.5.4. http://www.smileycat.com/miaow/archives/000226.php

4. research

4.1. what is this about

4.1.1. who the hell is that guy?

4.1.2. Collecting, updating and presenting information about users' needs, habits, experience and capabilities.

4.2. qualitative

4.2.1. interviews

4.2.1.1. stakeholders

4.2.1.2. users (and customers)

4.2.1.2.1. users' feedback

4.2.1.3. subject matter experts

4.2.1.3.1. expert analyses

4.2.1.3.2. usability problems

4.2.1.4. one-on-one

4.2.1.5. focus groups

4.2.2. observations

4.2.2.1. shadowing

4.2.2.2. current Web site content

4.2.2.3. users

4.2.2.4. customer visits

4.2.3. other tools

4.2.3.1. competitive research

4.2.3.2. card sorting

4.2.3.3. usability testing

4.3. quantitative

4.3.1. questionaire

4.3.2. database

4.3.3. Google Analytics

4.3.4. tracking

4.3.4.1. clicks

4.3.4.1.1. ClickHeat

4.3.4.2. mouse movements

4.3.4.2.1. mouseflow.com

4.3.4.2.2. userfly.com

4.3.4.3. eyes

4.4. deliverables

4.4.1. personas

4.4.1.1. are about

4.4.1.1.1. behavior patterns

4.4.1.1.2. motivations, goals (and maybe then tasks)

4.4.1.2. made from real data

4.4.1.3. improves communicaiton within the team

4.4.1.4. ad-hoc/provisional personas

4.4.2. optional

4.4.2.1. custom reports

4.4.2.1.1. mind maps

4.4.2.1.2. diagrams

4.4.2.1.3. mood boards

4.4.2.1.4. graphs

4.4.2.2. usability reports

4.4.2.2.1. redesign

5. design

5.1. what is this about

5.1.1. design without the design

5.1.2. Vizualizace informaci ziskanych vyzkumem do podoby prvotnich navrhu a prototypu blize definujicich vysledny produkt.

5.2. tools

5.2.1. wireframes

5.2.1.1. sketchbooks

5.2.1.2. black ink

5.2.1.3. software

5.2.1.3.1. OmniGraffle

5.2.1.3.2. Protoshare

5.2.1.3.3. iPlotz

5.2.1.3.4. Balsamiq

5.2.2. competitive analyses

5.2.3. concept models

5.2.4. design patterns

5.2.5. usability studies

5.2.6. design patterns

5.2.6.1. http://www.welie.com/patterns/

5.2.6.2. http://developer.yahoo.com/ypatterns/

5.2.6.3. http://patterntap.com/

5.3. ideas

5.3.1. mood boards

5.3.2. mind maps

5.3.3. idea sessions

5.3.3.1. brainstorming

5.3.3.2. scamper

5.3.3.3. the four r's

5.4. deliverables

5.4.1. scenarios

5.4.1.1. employs personas

5.4.1.2. describes user using the system

5.4.1.3. zahrnuji okolnosti z bezneho zivota

5.4.1.4. nepopisuji obrazovku

5.4.1.5. lze zapisovat k personam ale netyka se to jiz researche

5.4.2. requirements / tasks lists

5.4.2.1. the result of scenarios & the personas' goals

5.4.3. wireframes, framework

5.4.3.1. layout (macro design)

5.4.3.1.1. grid

5.4.3.1.2. header, footer

5.4.3.1.3. panes, sidebars

5.4.3.2. controls and widgets (micro design)

5.4.3.2.1. button bars

5.4.3.2.2. admin features

5.4.3.2.3. breadcrumbs

5.4.3.2.4. custom features

5.4.4. site maps

5.4.5. optional

5.4.5.1. storyboards

5.4.5.1.1. fancy scenarios

5.4.5.1.2. Brown je v personach uvadi jako behavior

5.4.5.2. flow charts / task flows

5.4.5.2.1. vizualizovane tasky

5.4.5.2.2. rozhodovaci stromy

5.4.5.3. use cases

5.4.5.3.1. vizualizovane tasky

5.4.5.4. prototypes

5.4.5.4.1. interactive wireframes

5.4.5.4.2. cheap testing

5.4.5.4.3. tools

6. solution

6.1. what is this about

6.1.1. polish, please!

6.1.2. Prechod od modelu a prototypu ke navrhu konecnych obrazovek a vytvoreni visualniho frameworku.

6.2. deliverables

6.2.1. visual framework

6.2.1.1. layout framework

6.2.1.2. typography

6.2.1.3. colors

6.2.1.4. icons

6.2.2. screen designs