WDCH
INTERACTIVE | PRINT
Confluences - Walt Disney Concert Hall. The interactive media project took viewers behind the scenes into the 15-year design process of The Walt Disney Concert Hall, exposing a complex web of confluences and relationships underlying the realization of this landmark.
Why
The Walt Disney Concert Hall is a complex, world-class acoustic space. The building’s form conceals the intricate interrelationships between design processes, acoustics, engineering, and building systems. These overlapping competencies deeply influenced the evolution of the final Concert Hall - a story that needed to be revealed.How
The team created an interactive media project adopting a detail-in-context approach to the user experience. Viewers could tour the concert hall building, and also expose the underlying building design process, fabrication, acoustics, architectural considerations, and construction technologies that came together. Viewers gained a deeper understanding of the 3D technologies invented and perfected over the 15-year creation of this iconic building – a world-class acoustic hall and striking landmark for the city of Los Angeles.Result
The interactive was used by concert hall tour guides and docents to orient visitors before taking them on the physical tour, enhancing their experience and appreciation of the building components. The interactive was available as a CD-ROM and print publication.Role(s)
Creative Director.Ideation, Project Lead, Team Development, UX/UI
The Book and media disc.
The BUILDING section takes visitors through the Concert Hall's physical spaces, and behind the scenes to reveal how hidden functional areas contribute to the hall's success.
The PROCESS section walks users through the design process from initial concept sketches through to the Hall's physical realization from start to finish.
The SURFACES section reveals details and geometries of the building's surfaces and envelope - exploring how they were conceived, designed, engineered and fabricated.
The ACOUSTICS section explores the complex acoustic considerations involved in creating a world class acoustic space, in the noisy core of downtown Los Angeles.
The Navigation layer is embedded directly within the content layer, which allowed viewers to stay oriented as they explored the content and wandered through the connections.
Interactive Topic Map allowed viewers to visualize how disparate processes were related and revealed the connections and influences between disciplines. The Map also provided and alternate navigation through the sections.
FRANK GEHRY – Digital Project
EXHIBITION DESIGN
The Digital Project. Gehry's pioneering application of 3D processes from initial design through engineering, fabrication, construction, and contracting has had a paradigm-shifting impact on the AEC industry and built landscape. The Digital Project was a multi-screen video exhibition that engaged museum visitors with an in-depth look at this innovative and far-reaching application of 3D. The exhibition toured multiple venues, including MOCA-LA, Vitra, Milan Triennale, Design Museum, National Building Museum, Corcoran, among others.
Why
Gehry's architecture was realized in a landscape of constraining architectural-engineering-construction practice. How was it possible to realize visionary design in a context that disempowered architectural innovation? R&D and implementation of 3D technology solutions by Gehry's team allowed for radically innovative architecture to be built on time and on budget and created a major paradigm shift in the AEC industry. This story of radical innovation needed to be shared and understood.How
Building on an earlier commission for a video exhibit in the Gehry Retrospective at MOCA-LA, the project team developed a large-scale, touring video exhibition. Interviews were conducted at Gehry's studio using a green screen for video compositing. The audience was invited to wander through an open space of video monitors, graphics, and physical displays, with looping video and motion graphics. Audio domes (and headphones) drew viewers deeper into a complex, layered story-scape, expressed directly by his team about the 3D parametric design process in Gehry's architecture, and its significant impact on the AEC Industry.Result
The original MOCA-LA exhibit was an energetic locus in the retrospective. The Digital Project exhibition built on this by engaging viewers through audio, drawing them into the narratives broadcast locally under sound domes, and inviting them in to listen more closely with headsets. This participatory engagement enabled a deeper understanding and appreciation of a complex narrative. An extensive international touring schedule followed at major venues in Europe, North America, and China.Role(s)
Creative DirectorIdeation, Concept/Content R&D, Project Team Lead, Director of Video, UX/UI
Excerpts from an interview with Frank Gehry. Gehry speaks about the culture of architecture and the realization of buildings, and provides a broad picture of the nature of the industry, framing the challenges and opportunities.
Ambient Video Loop. This video offered a counterpoint to the more focused interview based content, and was projected within a softer area in the exhibition space.
A compilation of some of the videos and topics featured in the exhibition.
A composite of the videos included in the Gehry MOCA installation.
MOCA installation. Asynchronous video loops, with ambient audio and occasional synchronized audio, focused and directed the visitors attention.
Digital Project Exhibition, at the Danish Architecture Center.
Digital Project Exhibition. Detail
Digital Project Exhibition. Detail
Digital Project Exhibition. Detail
Digital Project Exhibition. Detail
Digital Project Exhibition. Detail
Digital Project Exhibition. Detail
Digital Project Exhibition. Detail
Digital Project Exhibition. Detail
Gehry Technologies
Visual Identity & Iconography Program
Gehry Technologies grew from 3D technologies to support in-house development into a large commercial software suite. GT commissioned development support for UX/UI, Iconography systems, and visual identity for the commercialization of the software suite.
Why
Digital Project Software Suite grew from a series of in-house technology solutions. The software suite called for further evolution in UX/UI and a new visual identity for Gehry Technologies.How
Assembling a small team, we designed a clear language for the Digital Project iconography program, and working with the GT management team, we developed a new visual identity, collateral material, and brand guidelines for Gehry Technologies.Result
A fresh visual identity, and comprehensive iconography for the Digital Project software.Role(s)
Creative DirectorDesign Lead, Visual Identity and Iconography, UX/UI
GT logo and wordmark
GT Logo - variants
GT Collateral - Letterhead, Envelope, Business Card
GT Collateral - Powerpoint/Keynote Presentation templates.
GT Identity. Product badges.
GT Iconography. Digital Project Software - Interface Design and Iconography program.
GLENN GOULD
Interactive design
Glenn Gould: The New Listener. Interactive media exploration of Glenn Gould's prolific musical expression, and the connections between his views, opinions, and life experience. The project won several awards including a NEMN Silver Apple, and an EMMA.
Why
Glenn Gould is one of the most celebrated classical pianists of the 20th century. He was also a writer, composer, conductor, and broadcaster. A colourful, prolific figure, the story of Gould's life and its influence on his music was a story waiting to be told.How
Gould's personal life was woven into his profound musical engagement. The project team created immersive, interactive environments in which his work, personal experiences, and opinions could be experienced more fully. The interactive recreated Gould's original musical experiments with contrapuntal music passages, allowing users to enter Gould's world and create and experiment with his original master recordings.Result
Glenn Gould: The New Listener won a number of awards including a NEMN Silver Apple and an EMMA. The project allowed people to experience a different side of this cultural icon and gain a deeper appreciation of the very real person behind the musical genius.Role(s)
Creative DirectorDesign Lead, Concept R&D, UX/UI
Glenn Gould, The New Listener - Introductory video.
Glenn Gould, The New Listener - video extract.
Glenn Gould, The New Listener. Still from CD-ROM.
Glenn Gould, The New Listener. Still from CD-ROM.
Glenn Gould, The New Listener. Still from CD-ROM.
Glenn Gould, The New Listener. Contrapuntal Radio. Still from CD-ROM.
Glenn Gould, The New Listener. The Idea of North. Still from CD-ROM.
Glenn Gould, The New Listener. The Idea of North. Still from CD-ROM.
Glenn Gould, The New Listener. The Idea of North. Still from CD-ROM.
Glenn Gould, The New Listener. Gould's Apartment. Still from CD-ROM.
Glenn Gould, The New Listener. Still from CD-ROM.
Glenn Gould, The New Listener. A Private Quartet. Still from CD-ROM.
Glenn Gould, The New Listener. A Private Quartet database. Still from CD-ROM.
Glenn Gould, The New Listener. Still from CD-ROM.
HARD
Electronic press kit
Hard - a hard-hitting rock band. Visual branding, story development, and imagery for the EPK. Worked closely with band members to develop the mythology - narrative, characters, and storylines... The poetry bomb, The invisible dog, Dr. Bad - developed the imagery and visual narratives, and had a lot of fun.
Why
Hard was a concept band with a hard-hitting sound backed by powerful lyrics - Who's got your power if you don't got your power? - They needed an equally powerful visual identity and presence.How
Worked closely with the band members to develop the mythology of hard - characters, scenarios, narratives, storylines - and translated those into powerful visuals for use in the EPK and promo materials.Result
A seminal experience, a lot of fun, and some cool tunes and visuals.Role(s)
Creative Direction, Strategy, Illustration
Where's Roofdog? (only in reflection)
The Poetry Bomb
CHROMANOISE ™ ... Nevermind (the sugar refinery)
Who's got your power?
The Dr. Bad Laugh
Hard logo
NIKON SCAN UI
UX/UI Design
Nikon UI. The design brief called for UX/UI redesign to appeal to a wider user base. The original UI had been developed by the internal engineering team, and Nikon Digital's management was receptive to adopting a human-centered design process.
Why
Nikon had an excellent line of scanners, however, the original GUI was still based on engineering-centric layouts and process flows, resulting in poor uptake. The redesign would accommodate a wider user base, and provide an improved user experience.How
Working with Nikon management, we introduced a human-centered design process. This was a key shift from specification-driven, engineering-centered design, to a prototype-driven, user-tested, design-driven process. We wanted to provide professional image editors access to the scanner’s high-end capabilities, while also addressing the needs of non-professionals, in a friendly, intuitive user experience. Adopting an iterative process for design development, with design mock-ups, interactive prototypes, and iterative testing of new UI/UX concepts with a diverse user base, provided the ground for the definition of a new human-centric UI specification. This collaborative and iterative design process produced an enduring and unique UI that appealed to a wider user-base and created a valuable human-centric shift in Nikon Digital’s software development.Result
While the objective of the design brief was a new UX/UI, the human-centric shift in Nikon’s software development process was an unexpected outcome.Role(s)
Creative DirectorUX/UI, Design Lead
Nikon Scan UI
Nikon Scan UI - detail, scan settings tabbed interface.
Nikon Scan UI - detail, access to thumbnails - tabbed interface.
Nikon Scan UI - detail, detachable tabs.
Nikon Scan UI - detail, detachable tabs. Combined histogram and curves interface.
OMBU
SOFTWARE DESIGN
Ombu - a cloud-based application for the authoring and sharing of rich-media web experiences. Evolved from field work in building content-driven interactive presentations with clients, Ombu provided a platform and collaborative framework for the creation of compelling interactive stories directly in real-time.
Why
While developing the Walt Disney Concert Hall interactive, client access was a bottleneck. We innovated our approach to reduce the iteration and feedback cycles and this allowed us to iterate rapidly as we evolved content with the client's expertise. This provided a seed idea for a product concept.How
For the WDCH project, we created an adaptive workflow to develop content in real-time directly with the client. The process proved to be highly successful with stakeholders and revealed the opportunity for a more robust, formal application framework. We bootstrapped an application for authoring and publishing rich-media presentations directly in the browser, creating a collaborative framework for teams to author rich media presentations. A significant feature of the application was embedding the detail-in-context navigation layer directly within the presentation itself, allowing end-users to experience both the content and navigation together.Result
OMBU was well-received critically and has been used for developing and publishing courseware and online training.Role(s)
Concept, Creative Director.Ideation, IA, UX/UI.
Application Screenshot. Presentation mode.
Application screenshot. Navigation Layer.
Application screenshot. Presentation mode.
Application screenshot. Author mode.
Health Canada
anti-smoking campaign - proposal
Smoking Will Kill You. In response to a Health Canada RFP, we took a different approach. Moving away from the physical effects of smoking on the body as a deterrent, we opted for a more psychological approach to the communication challenge.
Why
A response to a Health Canada proposal request for a new approach to the anti-smoking campaign.How
The project team moved away from typical representations of physical damage from smoking as a deterrent. Despite years of this approach, people who clearly realized that smoking could kill them, intelligent, informed people still smoked. We played at the edge of a strong and hard-hitting communication program using striking imagery and messaging, to address the emotional and psychological impact, and consequences of smoking – both on the smoker and on the loved ones around them.Result
The result was a fresh approach to imagery and messaging as a deterrent to the continued use of tobacco products. While we did not get the commission, we had fun developing the concept.Role(s)
Creative DirectorIdeation, Creative Direction
SELFDESIGN
STRATEGY | BRAND | IDENTITY | WEBSITE
SelfDesign Learning Foundation is the second-largest K-12 distributed learning institution in BC. A revised communication strategy, visual identity, and website improved the organization’s outreach and growth opportunities.
Why
SelfDesign's learner-centric approach has been a pioneering new model for K-12 education. The organization’s branding and communications had grown in an ad-hoc manner over time and needed re-shaping to meet the growing demand for alternative public education.How
There was a disconnect between the program offerings and the demonstrated demand. The project team worked with the internal communications department to 1) find ways to present their philosophy and innovative programs, and 2) to help parents and families better understand options and help make informed choices for their child’s education.
We collaboratively developed a communication/design strategy, articulated a project development plan and workflow. Sharing best practices with SelfDesign, we conducted a thorough analysis of the existing communications and identity and made core recommendations for shaping a new values-based, user-centric communication culture. We leveraged this to design a clean, outward-looking brand identity, customer-focused communication strategy, and public website. It is steeped in methodologies for passion-based learning and life-long learning engagement. The organization plays an invaluable role in the evolution of K-12 education through its vital service.Result
The project was completed on time and on budget. The resulting work was well regarded by the board, welcomed by the administration, readily adopted by the community-based organization, and helped to galvanize the organization.Role(s)
Creative Direction.Communication strategy, Visual Identity, Site architecture, UX/UI
Design Review. Outcomes and recommendations from a comprehensive review of SelfDesign's previous communications and identity. (PDF)
A New Identity for SelfDesign. Presentation outlining the rationale and proposal for a new identity. (PDF)
A New website for SelfDesign. Presentation outlining the design parameters for a new consolidated public facing website. (PDF)
Site Mockup. A flat site mockup to test and validate the design direction. (PDF)
The Brand Guide. Guidelines to support the integration of the brand and identity into the organization. (PDF)
SelfDesign Project Summary. An overview of the design process for the Communication, Branding, Identity and Site Design project. (PDF)
Radian
visual identity
Along with a redesign of Radian’s communications, was a client request to use a vast in-house archive of field photography. The design challenge was to find a way to work with the client's disparate image base to create a cohesive identity.
Why
Radian Communication Services provided communications infrastructure services, including network design, installation and management, tower engineering, and construction to the telecommunications and broadcast industries. The company required a revised brand, marketing collateral, and look and feel for their communications.How
Along with the request for the redesign of Radian’s communications, came a request to explore ways in which Radian could continue to use their vast archive of field photography. Radian field staff had been documenting remote installations and work projects for some time, however, unlike professional image resources, these included of a very wide range of qualities. Working with Hale Marketing, we came up with a proposal to treat the images and use them in combination with stock photography, to create a flexible, adaptive design program. We achieved great results by working with the idea of collage as narrative, combining and treating the imagery in Photoshop and applying a unifying colour system to create a design program with a high-impact visual treatment.Result
The result was a happy client.Role(s)
Creative Director.Ideation, Creative Direction, Concept Art.
THOUGHTSHARE
DIRECTOR OF DESIGN
ThoughtShare Communications. Founding member and Director of Design. ThoughtShare developed tools for web-based knowledge management, a product suite for better collaborative use of web content.
Why
The web was expanding exponentially, yet collaborative use of the growing shared knowledge base was limited. We set out to create a new framework for web-based collaboration, and identified a set of forward-thinking applications targeting the early-stage knowledge management sector.How
With the participation of researchers at Simon Fraser University, we analyzed cognitive behavior and content aggregation and management in early web use. With our findings, we were able to develop a sophisticated suite of products that addressed collaborative knowledge sharing of web-based content. Adhering to human-centered design principles, the design team was responsible for the UX/UI, collaborated closely with the CTO and IT team to extend the IP into the conception of supporting server-side software, and played a pivotal role in the culture of the organization, including the design of company’s brand and physical workspace.Result
As a founding member of a tech start-up, we grew the company from a small five-person team to a publicly funded company with 90+ staff. The design team was responsible for generating key software innovation, human-centric application front-end, corporate brand, corporate website and driving innovation through a creative collaborative culture.Role(s)
Director of Design.Software Ideation, Creative Direction, Design Management, Team Development, Information Architecture, UX/UI, Branding, Web Design.
ALETTA
Industrial Design
Aletta is a reframe of the classic pendant lamp. The idea evolved from an exercise in the functional limitations of everyday objects and the changing use of domestic space.
An inverting light cone expands light into a room or focuses it on the surface below. A simple adjustment of a counterweight changes this balance, adding a poetic gestural dimension. Aletta received the Forum Design Award, 10 best products - 1989 Milan Salone del Mobile.
Why
Typical pendant dining room lighting is limited to illuminating the narrow focus on the ritual of dining. The innovation of a more responsive light fixture expanded that functionality in a simple way.How
Aletta allows you to affect the quality of lighting in the dining room by adjusting the light source to allow more flexible use of the public/private space. Dividing the lighting cone into segments, hinging each, and connecting them all to a common counter-weight allowed a typical pendant lighting cone to be inverted, with the lightest of touch, allowing a shift in the ambiance of the room with a simple gesture. A downlight focused on the surface and the ritual of dining and the uplight opens up the room - a Promethean gesture.Result
Winner of the Forum Design Award. Aletta was chosen as one of the 10 best products of the 1989 Salone Del Mobile in Milan.Role(s)
Product/Industrial Designer.
Aletta. Aluminium reflectors balanced on the edge of a polycarbonate cone, and connected by thin silver chains to a silicone-coated counterweight.
Aletta composite
Aletta materials.
Aletta calibrated to provide focused downlight.
Aletta calibrated to provide diffused general light.
Aletta calibrated to provide focused uplight.