Axure - Responsive layout - browser width

I’ve been playing around with scroll spy and re-creating this effect in Axure. Now, I’ve started to tackle responsive layout and browser width.

Axure is a great tool for making wireframes come to life - seriously. When you’re building a web or mobile application you’re better off with a complete clickable prototype then leaving your client guessing.

Responsive layout in Axure

This is a bit more complex - but start with a Dynamic Panel and (using the newer Axure v6.5b) select pin to browser. Make sure you pin it on the right hand side.

Then using scroll-spy / aka crazy flicker and some image map areas - you can detect when the browser width changes.

Hints - Next Steps?

The tricky part is columns and other objects that are stuck to the page. A way around this is to use a different set of pages for the narrower widths.

The results are great!

What do you think? have you tried doing responsive designs in Axure?

Meet the author

Damien Saunders
An experienced management consultant and business leader interested in digital transformation, product centred design and scaled agile. If I'm not writing about living with UCTD (an autoimmune disease), I'm probably listening to music, reading a book or learning more about wine.
Find our more about me.