Comments on: InDesign For Interactive Design Wireframing

By: David Blatner

David Blatner — Mon, 20 Oct 2008 20:42:10 +0000

@Heather: I need to be clear here: I was talking about making flowcharts and that kind of thing (what goes to what), but I do not recommend people actually making web pages or web sites in InDesign. You can export XHTML, but you’re not going to get page design, and so on. Better to use a tool such as Dreamweaver to actually lay out the site.

By: Heather

Heather — Fri, 17 Oct 2008 01:38:11 +0000

HELP
question is: if I design my website in Indesign

1. what are basic formats/info I need to set my page up in indesign to prepare for exporting for webpage (size, color settings, bleeding,etc)?
2. in regards to pictuers on the page, do i insert jpeg pics into indesign page and then export or can i export into say photoshop and then insert the photos
3. do i finish all text in indesign or can i export webpage design from indesign into ?photoshop or adobe 8 and then revise teh text? using?
?
4. do i export webpage design as xhtml?
5. what size should my pictures be in jpegs before i insert them?
6. then what do i do after i finished the whole design and text of the webpages?

I am really a totally new user, can design everything on indesign, but don’t know what to do then.

any help would greatly be appreciated

By: penina

penina — Fri, 19 Sep 2008 20:49:23 +0000

ooo! nice! Thanks for the tip. Will check it out.

I’ve started a practice page. ID is so automated, I’m a little thrown off, but maybe I’m overdoing it.

I changed to Color Settings to North America Web/Internet, and changed Proof Setup to sRGB IEC61966-2.1.

I’ll need to export JPGs for online review by the team, and I hope to turn the whole thing into my style guide/spec doc by adding a “spec layer” once layouts are approved.

By: Roland

Roland — Fri, 19 Sep 2008 10:24:32 +0000

Maybe the “Layout Zone” script thing will work for that. There’s a post about it on this blog somewhere.
You could manually do what the script does: save the selection as an INDD file and place that file in the same location as the selection.
To update the ’selection’, edit the placed INDD file.

By: penina

penina — Fri, 19 Sep 2008 01:06:59 +0000

I’m designing more large sites now, and found your post because I am considering using inDesign to design the next one. I want to be able to put repeated elements onto a master page. Then, when we make changes to any of those repeated elements, I would only have to change them once on the master, rather than going back to each photoshop page, as I do now, to propagate the change.

I’m open to other suggestions!

Thanks

By: Klaus Nordby

Klaus Nordby — Mon, 18 Aug 2008 18:56:17 +0000

Lauren, not to worry: you can design your whole website in InDesign, as it ouputs flawless XHTML. There’s just the little matter of styling it with CSS — once your past that hurdle, web design with ID is plain sailing, and in many ways preferable to Dreamweaver. I now, ahem, “firmly encourage” at least one of my students to NOT touch DW at all, but do his work all in ID. He hates me slightly for it, but is also coming along to my way of thinking: separate (A) design from (B) coding. Doing web *design* in DW sucks the hapless designer into messing with code right away, but HTML/CSS has got *nothing* to do with design proper.

By: lauren

lauren — Mon, 18 Aug 2008 14:45:41 +0000

Thanks for sharing. This is very cool and intriging to me. I’m a die hard no-web-allowed type of print designer. But this might just make me try out a web page for the first time. (With a hired programmer, of course!)

By: Eugene Tyson

Eugene Tyson — Mon, 18 Aug 2008 14:34:25 +0000

Hey Roland, doing a mock-up, in any package, is still wire-framing. Some people are not using Fireworks and Photoshop to wireframe (mock-up) their sites because they feel that InDesign is more flexible for them.

You could wireframe a site in MS Word (if you dare).

For all intent and purposes, I think the point was to highlight that you can wireframe in InDesign and some kind folks have whipped up a library of objects to share with other people that want to use InDesign to wireframe their sites too.

By: Roland

Roland — Mon, 18 Aug 2008 14:11:47 +0000

Eugene, that sounds like a mock-up to me, and exactly what Fireworks and Photoshop also let you do (assuming you’re not flattening things) … When I get home I’ll hit google to see if I can’t get any more info (with pictures or video) on all of this ’cause it’s clearly still going way over my head.

By the way, I found out I’m an interactive designer too; my customers can interact with me.

By: Eugene

Eugene — Mon, 18 Aug 2008 10:03:02 +0000

Roland, it’s just used to put together a basic layout idea, before anything final is put into place. It’s far easier to draw up the elements of a web page, than to program the elements into the web page. It’s just quicker.

The wireframe, or static page, is used as a visual reference when putting the actual website together.

It alows for variations and to maintain a design consistency for websites.