Isometric Experience Maps: An Interview with Jason Wishard
This interview is a transcript of a discussion between Nathan Curtis, creator of EightShapes Unify, and Jason Wishard, an interaction designer at EightShapes. Jason led the formalization of how to present appealing isometric experience maps and architectures within the latest release of EightShapes Unify.
NC: What are isometric experience maps?
JW: Unlike two dimensional flows and site maps, isometric experience maps give depth to those same flows and maps. Isometrics give a three quarter view of a site or applications overall experience. This not only helps communicate the experience, but allows for more information to be shown on a page.
With the resources provided in EightShapes Unify, experience maps can be created within any deliverable template.These include a new isometrics library of many starter objects and a grid snippet.
NC: When is it appropriate to use a Isometric Experience Map?
JW: Admittedly, there are many times when a two dimensional site map or flow can be created and convey the same information just as effectively as an isometric experience map. Where an isometric map can be helpful is when you need to display a complex or broad map of information, to project participants outside the design team, including executives. You can use them to convey big ideas, confirm understanding of project scope, and sell ideas.
NC: What part of a isometric experience map ends up being the most important?
JW: Two things: the whole picture as well as specific details, and it depends on what messages the creator wants to convey. For example, the diagram could convey how multiple site, sections of a site, or a site and related applications converge as well as the specific connection points between them. Many times, actually visualizing key page designs from each of those areas makes all the difference, since consumers of the document can confidently identify what’s what and see each part of the experience rather than imagining what a box with a label abstractly refers to.
NC: Do you have to be a good at InDesign in order to make a compelling isometric experience map?
JW: You can create some basic experience maps by using Page objects, changing their labels, and adding screenshots. In order to create really powerful isometric site maps, however, you’ll benefit from knowing many features of InDesign. For example, understanding how to transform objects, group & ungroup starter shapes, place and resize artwork, and using the direct selection tool all come into play.
NC: Have you ever used a isometric experience map in a project that’s ended up working really well? Why did it work well?
JW: Yes, we worked with a rather large enterprise client that was overhauling a large area of their site. In order to convey the importance of the user experience, we needed to show what portions of the site were underperforming vs. over-performing with layered-in site analytics.
The challenge we faced was that executives weren’t about to consume and make good decisions based on spreadsheets or even a site map with boxes and arrows. Using an isometric experience map, we were able to give a fantastic 30,000 feet view of vital pages and areas of the site and overlay that data. The diagrams really engaged everyone, including the executives who directly connected with the impacts on the pages they chose to invest in.
NC: Have you ever ended up wasting too much time on a isometric experience map?
JW: It’s all relative. One can spend too much time creating a conventional two dimensional site map or flow just as much as they can with a isometric experience map. The key difference is that a isometric experience map can often provide more value, context, and appeal for marginally more effort than a traditional map. Like with any other deliverable you produce, you have to assess the value relative to the effort needed to produce it.
Did anyone at EightShapes find the isometric diagrams created by Krzysztof Lenk and others at Dynamic diagrams related to the work you are now marketing? Do you think it might be helpful to make reference to any of the publications, starting from the diagrams published in Richard Saul Wurman’s Information Architects (Graphis 1996), “MAPA: a system for inducing and visualizing hierarchy in websites” published in the 9th ACM Hypertext conference proceedings HT’98, Kahn and Lenk’s Mapping Websites (Rotovision 2001) which was published in four other languages, or “Applications of isometric projection for visualizing web sites” IDJ 1:3 (2002), which explains and demonstrates the technique?
Thanks for your references Paul, we’ll be sure to take a look soon. We’ve tried to find our way to best communicate such diagrams, but I’m excited to be exposed to some rigorous documentation on the subject.
In the meantime, I’ve added some links to the work you describe to our “Isometrics” page linked to from the bottom of this page. If there are any updates we can make to the assets based on this material, let us know!
I am using your Isometrics toolkit to create a System Map for our UI specification, showing all the different branches & core workflows of the application. This library is AWESOME for making these flows beautiful & readable for non-UX nerds! Thank you again for making me look like a HERO to my boss!