To the front pageThe Interaction Designer's Coffee Break - Weekly postings and quarterly articles about interaction design  
  To the front pageSign inTo the frontpageSearch in GUUUI postingsAbout GUUUI  
   
 

Prototyping with Adobe Fireworks

It seems like Adobe Fireworks is becoming a new favourite prototyping tool of many interaction designers. With the CS3 version, Adobe has added a number of new features that makes it interesting for prototyping purposes:

- You can create pages instead of having to work with a maze of layers
- You can have a master page holding elements shared across pages
- It comes with a library of common user interface widgets that you can drag and drop onto pages
- You can create your own widgets
- You can make elements clickable and link them to other pages
- You can export the whole thing as web pages to create a clickable prototype
- You can work with schematic designs to fully treated graphic designs

Below you'll find a video and three tutorials on how to use Fireworks as a prototyping tool.

Links:

  • Video of a web page made with Fireworks Open link in new window
  • Tutorial: Rapid prototyping in Fireworks CS3 Open link in new window
  • Tutorial: Wireframing with Fireworks CS3 Open link in new window
  • Tutorial: Using Fireworks CS3 to design effective, interactive website presentations Open link in new window

Henrik Olsen - March 24, 2008

See also: Tools (106)  Prototyping and wireframing (119) 

 

COMMENTS

Thanks for this collection!

Tobias | March 28, 2008

 

You're welcome ;)

Henrik Olsen | March 31, 2008

 

Fireworks is indeed a great tool for prototyping. We figured out how it also can work for prototyping for the iPhone. This is how you do it: unitid.nl/2009/04/prototyping-for-the-iphone-using-fireworks-cs3/

Matthijs Collard | April 26, 2009

 

I remember Imageready was a tool in web site prototyping before, with the rollovers and stuff. But I heard about Fireworks and the myriad of things you can do with it - iPhone apps, Adobe Air widgets. I can\'t wait to try this!

Marcus Dane | April 07, 2010

 

Sponsor

Ad for TechSmith Morae


Browse GUUUI postings

Methods and the design process

Prototyping and wireframing (119)  Usability testing (68)  Cost-justification and ROI (27)  User research (23)  Personas (19)  The design process (24)  Eye-tracking (14)  Card sorting (13)  Web traffic analysis (12)  Expert reviews (11)  Implementing user-centred design (9)  Site and flow diagramming (6)  Envisionments (4)  Use Cases (3) 

Design elements

Navigation (63)  Web page design (40)  Search (27)  Text (24)  Forms (30)  Links (19)  Guidelines and Standards (15)  Site design (14)  Ads (9)  Design patterns (8)  Sections (8)  Shopping Carts (9)  Error handling (7)  Home pages (9)  Help (3)  E-mails (3)  Sitemaps (2)  Personalization (1)  Print-friendly (1)  Landing pages (5) 

General aspects

E-commerce (27)  Persuasive design (21)  Visual design (19)  Information architecture (15)  Accessibility (13)  Search engines (7)  Credibility, Trust and Privacy (6)  Emotional design (10)  Simplicity vs. capability (7)  Web applications (6)  Intranets (3) 

Technology

Flash (6)  Download time (5)  Javascript (3)  URLs (3)  Browsers (3)  Web standards (2) 

Humour

Bad designs (20)  Cartoons (14)  Fun music and videos (13)  Funny tools and games (12)  Misc humor (8)  Fun with Jakob Nielsen (9)  Designs with humor (3)  Fun posters (5)  Funny 404 pages (2) 

Resource types

Research (129)  Tips and guidelines (95)  Tools (106)  Books (47)  Audio and video (48)  Interviews (30)  Cases and Examples (28)  Talks and presentations (18)  GUUUI articles (11)  Primers (14)  Online books (5)  Posters (5)  Glossaries (3)  People and organisations (3) 

Information sources

Blogs (12)  Websites (11)  Discussion lists (4)  News (3)  Newsletters (3)  Online magazines (3)  Wikis (1) 

 
     
  To the front pageSign inTo the frontpageSearch in GUUUI postingsAbout GUUUI