Sent by Joy Bower on 8 December 2004 20:08
> I stopped using photoshop and illustrator early in the process and I
> saved a lot of headaches. This step introduced too much print medium
> bias that did not fit in the web medium (I also tend to hire folks
> that have do not use the graphic tools until the end). We get things
> done much more quickly and have a far more flexible framework. We
> also have a product that has the possibility of working well across
> platforms (desktop, mobile, etc.).
>
> 1 - Assess the content types
> 2 - Assess the content objects needed (photos, headers, browsing
> structures (navigations and link lists), text, charts, data tables,
> etc.)
> 3 - Outline page types needed (home page, browsing pages, destination
> pages (newsletter, memo, brochure/catalog, etc.))
> 4 - In valid XHTML and using proper semantic markup build wireframes
> for page types including content objects that are needed in these page
> types (use a wireframe CSS that turns on borders and only uses black,
> white, and greys)
> 5 - Add classes and ids where need to hang design, being sure to name
> these semantically (logo, localnav, globalnav, category1, etc.)
> 6 - Start adding presentational design in the CSS (required images,
> coloring, type weight, visual cues, etc.) - this is where one begins
> to use photoshop and illustrator
> 7 - Evaluate templates for redundant CSS and test design on people,
> and browsers
> 8 - Fix
> 9 - Dump in content
>
> I began working in this manner in 2001 and have been refining it
> since. If you are familiar with CSS Zen Garden and have designed for
> it, you have started at step 6. The hard work is done and the
> presentation can be modified on a whim quite easily. Starting with
> Photoshop and Illustrator too early, it is too easy to marry the
> content to the design and it will be hell fixing. This is the web we
> are building for not print (actually if designing print and web you
> would be benefited by following a nearly identical process and at step
> 6 design for print and web in conjunction and they should not be
> identical interfaces as they are very different medium).
Thanks for sharing your good ideas. I'm not sure I understand on part.
Will you please clarify?
Do you at some point in the process (and when?) spend time designing
the look/design of the visual interface? It appears to me from your
description that you do not spend time designing the interface. Step 6
sounds like the point at which you make whatever graphic pieces
(masthead, bullets, etc.) that you'll need. Is this correct? If not,
then what is the visual design process that you do and at what point in
the process is it done? Also, what is the name of the application you
use?
I like the idea that the look/design of the visual interface grows out
of the information architecture and user experience requirements. That
makes a lot of organic sense.
If you are saying that the visual design of websites should be
completely different from visual design for print, I disagree. Print
design has successfully addressed the making of many different kinds of
pages readable, with logical hierarchy and good flow of information. I
don't recommend taking a print design and making it into a website
without running it through the full web design research, analysis,
planning and design process, there is much of value in print visual
design for web designers.
If you are saying that no website should be highly visually designed, I
don't agree with that either. The visual design of any website should
be appropriate to the full spec of the project, including what the site
should look like and what it should do. Design is a choice (or rather a
series of many choices), up to the designer/developer and the customer.
Many highly designed sites are wonderful and gorgeous. So are many
sparely designed sites.
______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
