Portfolio Highlight: Emmanuel Laffon de Mazières | Form and function
Every year at graduation time, thousands of new product designers, like flocks of migrating birds, head for Core 77, Coroflot, or Behance. There they build an online portfolio nest and devour the extensive job lists. Many seldom venture away from their new home. If their portfolio is featured there, they’re front and center for the prospective employers who visit these sites. But then what? The next week, a new group is featured, and they move down to the next page and join the ranks in their category.
There’s nothing necessarily wrong with sticking with this instinctive scenario, unless you count the lost opportunities. Emmanuel Laffon de Mazières, recent transplant from France to California, certainly did. Using a dividing strategy, he fields a range of portfolios in different venues, each for a different audience.
Laffon’s projects work hard. A group of stills appears on Coroflot. A video on YouTube, scored to the music of Django Reinhardt, smoothly supports his 3D flyarounds, and when results are sorted by times viewed, it still appears as the first industrial design (ID) portfolio after the content featured for pay. His laptop presentation shows a full range of projects as well as process work. Most important, his prime projects are showcased in luxuriant close-ups on his personal website, to which all his other portfolio versions are linked.
The site was designed to immediately capture the viewer’s attention. The opening backgrounds, the work of a professional-photographer friend, were chosen for both beauty and visual simplicity so they would not overwhelm the portfolio itself. Once the portfolio window is engaged, your perception of them quickly changes from seeing them as content to experiencing them as color mattes around the work.
If there is one thing that should be evident in an ID portfolio, it’s concern for user experience. The study of human factors and the study of product design are tightly connected, and many of the most influential thinkers in usability began as industrial designers and engineers. So it’s a disappointment when ID websites are bleakly utilitarian or so dependent on Flash-based effects that a smooth experience is impossible.
The site fills the browser window with a startlingly rich background image behind the translucent window of the actual portfolio space. The opening images remain onscreen for each visit but appear on a cycle, so each visit to the site offers a fresh visual perspective.
The navigation cues are subtle but clear. When you click on a menu link, the type highlights and its background becomes opaque. Hover on a link and it changes under your cursor in the same way but more slowly, so you will notice the process.
Nothing could be further from Laffon’s design. Despite its lushly cinematic first impression, it provides clear and intuitive visual cues that concisely map the portfolio space.
In particular, he uses translucency not only as a setting for his portfolio frame, but to aid in navigation and as a way to keep visual focus firmly on his work. Navigation elements react by appearing to change their amount of transparency. Project briefs never obscure the work, and are easily dismissed without any distracting motion on the page itself.
Laffon initially hoped to create an HTML-based site, because most of the sites he admired as examples of clear navigation avoided the Flash temptation. As he says, “I finally decided to go with Flash because it allows me to be more creative in terms of layout and the translucency. But there are so many things you can do in Flash that can distract you from your original intent. You constantly have to limit yourself because it is so easy to overdo it.”
Exhibit, product, industrial, and architectural designers run up against an obvious limitation with their first professional portfolio. Few of their ideas have been built. In decades past, concept designs were obvious as such. In some portfolios, they-still are. Emmanuel’s work is so clean, crisp, and detailed that many of his concept pieces can be easily mistaken for photos, a fact that was brought home by the many people who contacted him wanting to buy his “huit sofa”—a loveseat concept based on the figure 8. Many of these people found the project through blog articles—a natural result of having so many possible points of entry to an intriguing project.
As it’s difficult to get the sense of a 3D object with one photo, Laffon presents his images from multiple views, and distances, at a size that makes their materials and scale apparent. Objects whose size might not be obvious are put in photographic context. In addition, Laffon’s site contains his video walkthrough, which is available in three resolutions—two viewable online, one downloadable in high resolution.
Laffon‘s website concentrates on finished, modeled projects that can speak for themselves with little context. His laptop presentation, however, contains process work that allows him to discuss how he arrives at and develops his ideas.
Laffon is particularly interested in consumer electronics and furniture, two areas that do not have much overlap. A few years down the road, he’ll probably have to make a choice, but for now he continues to add examples of both when he updates his site. He also goes back and reworks older designs as he sees better, more workable ways to build them, while weeding out older projects to make room. However, he intends to maintain his basic portfolio design for the foreseeable future because it works so well for him. Changing the background images to refresh his content and allowing the backgrounds to interact with his projects has kept his ideas fresh.