Elizabeth Churchill wrote one of my favourite pieces recently, Maps and Moralities, Blanks and Beasties, about using maps designed for online daters “showing areas of San Francisco in terms of nighttime inhabitation and illumination, aimed at people concerned with being alone at night in deserted places. The map shows which areas of San Francisco are dark and isolated in the evenings”. This is a great abstraction of personal safety through mapping activity. Just as companies like Dash are using a P2P network of other Dash users to build traffic and AirSage uses cellular signals to build traffic predictions and estimations. It’s possible to start building mapping applications for next generation mobile devices. In my favourite part of the article Churchill describes a solution where she "designed a map and route/navigation tool for perambulating San Francisco irrespective of footwear practicality. The map charts routes based on the height and style of your shoes with rules like: Five-inch platform boots should not be worn on steep slopes, and stylish stilettos are a no-no on potholed, grated Mission Street”. You can see her prototypes including MapChat based on current work at Yahoo Research. It’s possible to start building applications that enable individuals to share and use metadata relevant to them to construct safer routes.
The Aurora project has always intrigued me, a successor to the famed SR-71 Blackbird (though I thought it was designated SR-75 and not SR-91). In a vain of building a next generation experience, the team at Adaptive Path and Mozilla Labs have partnered to build the Aurora Concept, “a video presenting one possible future user experience for the web”. It’s the second time in recent history where I have been thoroughly impressed with the design process used by the Adaptive Path folks, check out my commentary on the book, Subject to Change, and the Charmr project. The work on the Aurora Concept is a fantastic way to design, prototype and explore future design directions for Firefox and Mozilla and how the web should be built for the next generation of uses.
Part 1 – Exploring shared experiences
Part 2 – Exploring mobility
Part 3 – Interacting with the physical world
Video as a prototyping is not new. Video has been explored by the HCI and design researchers for a long time. In 1992 at Sun, Bruce Tognazzni created the Starfire design prototype. The team at Apple created the Knowledge Navigator in 1987 and Future Shock in 1988. Video is a compelling storytelling medium allowing designers to explore concepts and ideas without having to create functional environments. They are engaging spots that are designed to present a dream to a community in a digestible format.
My favourite part of the Concept Series is the call for participation. It is an open call to designers, developers and others from industry and higher education to get involved and design a vision for the future. The goal is to “bring even more people to the table and provoke thought, facilitate discussion, and inspire future design directions for Firefox, the Mozilla project, and the Web as a whole”.
Concepts may take the form of Ideas, Mockups or Prototypes.
It all begins with an idea. A sentence, paragraph, or even bullet-points kick-start the process. Ideas can be simple and non-technical. It should be easy for anyone and everyone to help shape the future of the Web. So throw your notions, inspirations, dreams and visions out to the community.
Turn your idea (or someone else’s) into an image, sketch or video. Words are great, but you know what they say about pictures. Mockups offer up a visual and communicate ideas in terms that are just a bit more polished and real. They draw the next person in, tempting them to pick up the concept and run with it.
A prototype is interactive. Feel, touch and play with developing concepts. Prototypes get ideas across by showing off the moving parts. They aren’t always fully functional or pretty, but they’re more than a static image or two. They’re a dress rehearsal of sorts, with minimal programming. Make a prototype in HTML, Flash, or whatever puts things into action.
If I was a student designer looking for a design project to consider for my final year project I would think seriously about participating in the Concept Series or the Imagine Cup.
“If sketching is about asking questions, prototyping is about suggesting answers. Sketching takes place at the beginning of the development process, prototyping only later.” – Jessie Scanlon reviewing Buxton’s Sketching User Experiences in Business Week
As a designer I find that the most productive parts of a project are the exploration phase, the very early part where your are researching, sketching, exploring ideas and concepts trying to formulate an approach. It has always been really easy to grab my notebook and pen and begin drawing sketches of user experiences or find a whiteboard where you can sketch and erase and snap a picture when you’re done. Showing the initial designs to people, gathering feedback and making annotations. It has always been much more difficult and time consuming to build wireframes, screen flows, conceptual models, etc. There is a certain envy to being able to do low fidelity prototypes with a level of basic interactivity (if only because a number of past clients were not co-located and scanning sketches and providing written context was never enough, however, it might be a lot easier to share and annotate these days using ConceptShare, Octopz, Cozimo or DimDim).
It was tools like DENIM that first showed the power of sketching for web design. It provided a set of tools for creating sketches and adding interactivity to initial designs. DENIM allows users to create site maps, page flows, interaction scenarios and page designs using sketches. It works best with a tablet PC or a Wacom tablet. It works very similar to a paper notebook and can export the pages and links to HTML upon completion. The biggest challenge was that the integration with other tools was not significantly better than paper and pencil.
Today I found Balsamiq Mockups, a tool for creating mockups and designs using predefined sketched controls. No need to move to your tablet machine. No need to connect the Wacom. Just fire up Balsamiq and start laying out user interfaces. While sketched design templates are available for Graffle and Visio (check out Garrett Dimon’s Templates & Stencils; or Graffletopia; or YUI Stencil Kit). Balsamiq Mockups also makes it easy to integrate into a development workflow by allowing designers to export and integrate their designs into Confluence, Jira and TWiki.
I also discovered the Pencil Project. The Pencil Project is an open source tool aimed at diagramming and UI prototyping. It’s less of a tool for sketching and more of a replacement for Photoshop, Illustrator, Visio and Graffle that we’ve all become accustomed to using for creating higher fidelity interface mockups. The Pencil Project is available as a Firefox addon or as a standalone application using XULRunner. Pencil Project includes stencils for GTK controls, XP controls. It’s a great alternative to the existing tools.
|Sketching User Experiences: Getting the Design Right and the Right Design (Interactive Technologies)
by Bill Buxton
CAA South Central Ontario is looking for a Web & Multimedia Designer to join our growing eBusiness team.
What will you gain from your career experience at CAA SCO? Sure we’ve got great compensation, benefits and culture, but more importantly, you’ll thrive with the exposure to our multiple business lines including Travel, Insurance, Member Services and Member Advocacy!
Your Key Responsibilities
- Build new web pages and make web page adjustments according to CAA brand standards and specifications supplied by the Business Unit and the Online Marketing Lead
- Work within scope of web site and brand standards (CSS, CAA standards) to ensure all pages on our site comply and site structure is maintained
- Ensure our web site is compatible across main browsers (IE, Firefox, Safari, Opera)
- Create reusable web site templates
- Build on-line web forms for email distribution or database input
- Design creative microsites for contests, may involve use of Flash, video, banners, etc.
- Design web images for web pages, banner ads, x-sell/up-sell icons, etc.
- Create and deploy CAA’s 2 monthly eNewsletters
- Ideally you’ll be up to date with web industry tools, best practices, new technologies, techniques and methodologies and will participate in continual review of our web solutions and processes to improve results for the team, business units and CAA overall.
Your Education & Skills
- University degree or college degree in computer science preferred
- Able to use current web standards, best practices and optimal coding practices
- Familiar with source code version control systems, QA testing processes
- Excellent design skills: typography, web page layout, colour, user interface (UI), navigation
- Able to design for cross-platform/cross-browser compatibility
- Experience designing for a corporate web site using brand standards.
Please ensure to include urls with samples of your work.
Full Time Permanent Position in Edmonton, AB
As an nForm consultant, your primary responsibility will be translating business and customer insight into concrete plans and prototypes, such as conceptual models, interaction flows, wireframes, and functional specs. You will work with clients, their users, and nForm colleagues to understand, define, and solve problems to create business and user value through designing fantastic user experiences.
Excellent interpersonal skills are required for client-facing engagements. We’re a small firm so you’ll be called on to serve in a variety of roles–flexibility and the ability to tackle new challenges are important.
- Strong design portfolio including things like scenarios, interaction flows, sketches, sitemaps, wireframes, prototypes, and possibly great final interfaces
- Fluent with Visio, Omingraffle or other diagramming tool
- Ability to model interaction flow, navigation structure, and other structural components of system
- Ability to show ideas visually
- Ability to write clearly so that you can communicate your ideas
- HTML and CSS (you won’t be coding, but your designs need to be feasible)
- Web 2.0 awareness (from acronyms like RSS and RIA to your own thoughts on social software)
- Ability to listen and take direction
- Ability to learn new skills, both with guidance and on your own
- Ability to work independently
- Keen interest in the craft of user experience. We’d like to know who your influences are, where you look in the community for guidance and inspiration, what books and blogs you read, and who you think is doing the coolest work online
- 2 – 5 years of work experience doing interaction design or information architecture preferred. This experience may have been in a dedicated role, or as part of work doing innovative web design
- Your portfolio, process, and mindset trump both formal education and previous jobs, though we appreciate good schools and good work
- Salary based on experience, plus benefits to start, review at 6 months, 1 year, and then annually
- Signing bonus for the right employee
- Relocation assistance for the right employee (if you are moving across the country, North America, or internationally)
- Participation in employee bonus program
- 3 weeks vacation to start
- Participation in employee professional development program
Some compensation isn’t about money or benefits. We’re all here because we like working with an experienced, smart team that not only serves great clients, but also influences the practice of user experience across industry. In the last year and a half, nForm has spoken at the Chilean IA Retreat, the Government Marketing Workshop, DigitalNow 2007, UX Week, UPA 2007, the IA Summit 2007 & 2008, the German IA Conference, the Italian IA Summit, Northern Voice, with upcoming appearances at UPA 2008, and others. We host our own Canadian User Experience workshop, CanUX, every year in Banff.
It’s not just events. We regularly blog and write articles, we co-founded the IA Institute, and we’re thrilled to announce that company principal Gene Smith has recently published a book, titled Tagging: People-Powered Metadata for the Social Web.
How to Apply
Email your resume (Word or PDF) and link to your online portfolio to Yvonne Shek, at firstname.lastname@example.org. If we’re going to go ahead with an interview, we’ll let you know within a week. Unfortunately we can’t respond to everyone who applies, so if you haven’t heard from us in a week, we’re probably looking for a different skillset.
Dan Pink has released his latest career book, Johnny Bunko: The Last Career Guide You’ll Ever Need, it’s a manga book with all of that advice you wish someone had given you. Over a bourbon last night, Eli Singer and I were reflecting on manga, well Scott Pilgrim, and career paths. I was saying that I never imagined that I would be and “Evangelist”, this honestly wasn’t on my career career path at any point. It feels like a “career choice based on fundamental reasons”, something that I thought would be inherently valuable regardless of what it may lead to.
Garr Reynolds of Presentation Zen provides a beautiful summary of Johnny Bunko. The slides have only text or photographs from istockphoto.com. It’s 6 simple lessons about building a successful career that all students should take the time to read.
Comics are a great medium for telling stories.They allow artists and authors to create compelling characters in rich, believable worlds using nothing more than pictures. Kevin Cheng has shown that comics are a great medium for convey concepts including unbuilt sofware. Scott McLeod has published a series of books on the art form of comics as a communication tool including:
|Understanding Comics: The Invisible Art
by Scott Mccloud
|Reinventing Comics: How Imagination and Technology Are Revolutionizing an Art Form
by Scott Mccloud
|Making Comics: Storytelling Secrets of Comics, Manga and Graphic Novels
by Scott Mccloud
Dan Roam‘s new book The Back of the Napkin: Solving Problems and Selling Ideas with Pictures has a great set of techniques and tools for those of you who can’t draw. The VizThink community is a group of visual thinks to share their philosophies, experiences and approaches for using visualization for learning and communication. (VizThink has hired Ryan Coleman as their Chief Community Evangelist. And we’re back to the career discussion, I wonder if Evangelist was on Ryan’s path). If “The MFA is the New MBA“, then the visualization and communication tools presented are the foundations for the next generation of leaders and CEOs. And your career path might not have included becoming a designer, but there is obviously some market exchanges that can happen when, a picture is worth a thousand words.
|The Back of the Napkin: Solving Problems and Selling Ideas with Pictures
by Dan Roam
|Presentation Zen: Simple Ideas on Presentation Design and Delivery (Voices That Matter)
by Garr Reynolds