italiaDesign—11th Edition is an inquiry into italian design, history, and culture that documents the philosophy of the 18 designers we met throughout Italia.

Context

italiaDesign Fieldschool
Jan 2018 — Aug 2018

Contribution

Lead UX Designer
Visual Designer
Content Strategist

Gruppo

Shannon Boyd, Elizabeth Chan, Annette Cheung, Tobi Cheung, Kosuke Futsukaichi, Sean Leach, Sabrina Ng, Summer-Lee Schoenfeld, Mark Strathern, Sonia Yau, Rana Zokai, Russell Taylor—Field School Director

italiaDesign—11th Edition
An eight month long inquiry into italian design, history, and culture

italiaDesign is an undergraduate field school offered by Simon Fraser University which immerses students in Italian design, history, and culture. Through a competitive entry process, I was fortunate to be selected as one of twelve senior design students to embark on this experience.

Over the course of the field school, our team conducted in-field interviews which were developed into a film series that document the design philosophies of 18 designers. The accumulation of what we learnt, discovered, and experienced is presented on our website: italiaDesign—11th Edition.

01 | Pre-Field Research

Three months of in-depth research into Italian design, history, and culture, as well as establishing an approach for the art direction of our films

02 | In-Field Living

Two months of living and working in Italy, where we conducted interviews with 18 Italian designers and began developing our content strategy for the films

03 | Post-Field Production

Three months of post-production work which involved developing a website and editing seventeen films

Continuing the Lineage

italiaDesign is a legacy project that builds upon the work of previous field schools. Each group that embarks on this journey continues this lineage by crafting a website that conveys our experiences, stories, and interviews.

At the beginning of the process, each group has an unique opportunity to differentiate their project from past years by deciding how they want to represent their values through the website. With this in-mind, the design team established three guiding principles that served as the foundation for our approach towards the content strategy, art direction, and experience design of the project.

Honour the Designer

All decisions should be focused on honouring the designer's essence with accuracy and care. By focusing on the designers, we wanted to reduce the misperception that italiaDesign is about the field school team.

Respect the Content

The content we convey is the most consequential part of the project because it is a reflection of the designer's essence.  Therefore, the content strategy should lead in driving the form of the website.

Embrace Ambiguity

Inspired by Massimo's Vignelli's definition of ambiguity, we wanted our website to inspire a sense of curiosity by having a "plurality of meaning". In order to achieve this, we embraced the challenge of walking the fine-line between clarity and ambiguity.

"Respect the Canon"
A visual identity inspired by Modernism and Italian design

The team began the visual exploration process by gathering a diverse collection of visual design inspiration, interaction models, and approaches to organizing the content we had accumulated in-field. Afterwards, the design team consolidated similar inspirations into three directions, and decided on which key concepts we wanted to further pursue.

After converging on three directions, the design team diverged and created visual explorations of the homepage based off of these three key concepts we had aligned on...

01 | Exploring typographic scale

How can we use contrasting typographic scales to achieve a sense of visual power? Our desire is to achieve the elusive beauty of intellectual elegance through visual strength — not impact.

02 | Reflecting a print paradigm

Many of our design inspirations stemmed from the graphical work of our interviewees, such as , and Since we were already exploring typographic scale, how might we translate the print paradigm into digital in order to make our visual design feel more tactile?

03 | Telling a linear narrative

From our observations of previous field-school websites, we noticed that no previous teams had  attempted to construct a cohesive structure for the content. Therefore, we wanted to explore whether the visual design of our website could imply a narrative sequence?​​​​​​​

The Landing Screen
Framing the Experience

From observing previous field school websites, we felt that past teams had overlooked the importance of framing the purpose of field school. With this in-mind, our goal was to create a headline that would frame the website's experience, which we emphasized through the dramatic use of typographic scale.

By bleeding the typography off the page, we wanted to create a sense of ambiguity, prompting people to scroll through the headline and discover the films series at the end. In doing so, the headline acts as a threshold that guides people from the initial landing page into our collection of interviews.

Film Series List
Crafting a Linear Narrative

Within the Film Series List, we utilized large-scale typography to categorize the films into discrete volumes. The numbered volumes indicate a linear narrative for the series, thus creating an accessible entry point and a suggested viewing order for the films.

To provide context for each interview, we used a hover interaction to reveal additional content, such as the film title's name, volume description, and designer's portrait. This method of revealing context removes the friction of not knowing who the designers are, and clarifies the volume’s over-arching narrative. By crafting a linear narrative, our goal was to provide a comprehensive understanding of Italian Design, and how each designer fits within a larger story

Beyond the Film
Providing Additional Insights

italiaDesign is intended to be a resource for both students and professionals within the design community, where they can access content about Italian design through the lens of design, history, and culture. To further achieve this goal, we developed Beyond the Film - a section that showcases additional projects, artifacts, and insights that reinforces the design philosophies of each particular designer.

We designed Beyond the Film as an overlay to the video, so that viewers can easily access the content at any point while they watch the interviews. By providing these additional insights, the desired outcome was to compliment the film content by illuminating viewers on how each designers translates their design philosophies into their work

Credits Page
De-emphasizing our Presence

In past field school websites, the team page was typically dedicated to highlighting each team member and their personal experience of field school. For our team page, we wanted to de-emphasize our presence, because their was a growing misperception that the field school website is about the group - as opposed to the designers who we interviewed.

Therefore, our Art Director, Annette Cheung, opted to minimize our presence by not shooting traditional headshots. Instead, she chose to highlight our presence within an intimate space, in order to provide a glimpse of the various environments we experienced through out Italy. This approached aligned with our guiding principles, which included exploring a contrast in scale, embracing ambiguity, and honouring our designers.

Behind the Scenes
Sharing our Process

After user-testing our credits page, we discovered that field school alumni still had a desire to learn more about our team. To accommodate this desire, we decided to create Behind the Scenes - a new section that provides a glimpse into our in-field production process. By creating this new section, we were able to maintain our principle of minimizing or presence on the site, while accommodating the request of our users.

Similar to our credits page, the layout and experience of Behind the Scenes is inspired by the concept of scanning through a film strip. By using the same interaction of horizontal scroll, we had the opportunity to reveal a small moment of delight by introducing the new section towards the end of the credits page. As users press the call to action, they are seamlessly transitioned into Behind the Scenes, where they can view a collection of photos and videos of our team during our production process.