This is my (Liz’s) website.
I work at Airbnb on the design systems team and specialize in prototyping.
I am currently getting my Master’s in Design Engineering from Harvard focusing on computational design.
I do research at the Laboratory for Values in the Built Environment.
I also
hold a BA in Clinical Psychology from UC Berkeley.
If you have any questions, want to work together, or otherwise have complaints, email here.
LinkedIn
CV
06 Teaching2019-2024
Teaching Prototyping
CONTEXTFor the entirety of my tenure at Airbnb, I have been teaching prototyping classes. Students range from designers to researchers to engineers. Prototyping allows designers to look at the frames in between each static screen as well as the entirety of the flow. In my experience, very few tools are able to go as deep or as wide as prototyping.
For example, in going wide, a user is able to experience the transitions and interactions as a whole and understand their context. In going deep, prototyping allows for a finesse in micro-interactions, which creates a smoother experience.
I teach courses in both Principle in Origami.
Principle is an application that allows people to animate their designs. It is quite similar to After Effects in that it is keyframe based, but it streamlines a lot of interaction-design-specific animations to allow users to work faster.
Origami is an application that allows users to use visual code blocks to prototype interactions. By inputting the exact logic needed to create a sandboxed version of an application, designers are able to create prototypes that are as close to the live product as possible. This process allows everyone to see where the faults are, what works, and where we can improve.
Having multiple tools at their disposal means that teams can be more creative and design new interactions that previously weren’t available.
In this project, I created the course curriculum, assignments, live exercises, take-home assets (so that designers could refer back to the completed projects), a Principle library of components, and the documentation.
PrincipleThe beginner’s class focuses on understanding the software and what it is trying to accomplish. In a nutshell, what is prototyping and why do designers need to do it? After all, it is an extra step to be taken in the design process.
The secondary class focuses less on the software and more on easy-to-understand workflows. How do I get my work from Figma into Principle? How do I deliver this prototype?
The tertiary class focuses on micro-interactions and understanding motion principles. This class seeks to help designers add finesse and craft to their work and make it that much more robust.
EXPLORATION
Right: Screenshot of a completed project file after three courses in Principle
A large part of exploration was doing research. There aren’t many systems that touch upon spatial models with the depth that Google Material and the Apple HIG do. These two resources allowed me to start piecing together the problems that we were having as an organization and as a design system. For the most part, I noted that we were struggling with the density of our content and losing context of where the user is within a flow. Out of the two problems, I chose to focus on preserving context.
ORIGAMI
Right: Screenshot of a completed project file after three courses in Origami
Like with Principle, the Origami beginner’s class focuses on understanding the software and what it is trying to accomplish. How is different from timeline-based prototyping software? How can you navigate and use the software? What are the best practices that we can use to better understand our files?
The secondary class focuses on building a very simple interaction and explaining how code is read and how it differs from human understanding.
The tertiary class focuses on fleshing out the original interaction from the second class and having a completed project that they can reference in their work.