Project Manager | Fall'18
For design, Figma is one of the most powerful tools in terms of real-time collaboration, design systems, and developer hand-off. Projects in Figma are stored in the cloud and edited in the cloud: think of it like an ultimate Google Drive for design.
In LavaLab, we strive to build a collaborative environment to encourage engagement and connection for our cohorts every semester. Tools like Figma enable our designers, project managers, and developers to better communicate with each other and improve team productivity overall. As we'll see later, Figma is a tool for everyone.
In his LavaLab semester, Figma Fellow Andrew Hulin was the project manager of his team. Figma became a valuable platform for their early-stage concepts and visualization. In our walkthrough, Andrew covers the most valuable aspects of Figma and goes over quick prototyping skills for wire-framing with his past LavaLab project.
0:00:32 There's a lot of existing design apps, tools, and they all have different properties and workflows. Figma is really great at bringing them all together no matter what tool you use.
0:05:32 I'm going to show off some of the fun things that Figma can do through creating a wireframe of our project that we made in LavaLab my year.
0:06:26 This is Google's design language: it is open source and has a lot of detail and versatility. And the beauty of this is that it has [every component] you could possibly think of that exists within the functionality of an app.
0:10:11 Navigation App Bar
The interface element Andrew explains here appears at the top of an app screen to enable navigation through a series of hierarchical screens. Excellent UI makes navigation easy and creates accessible open roads for users.
0:13:12 Auto Layout Feature (shift + a) adds a set of rules or constraints that allows you to work with the elements that you design in really interesting ways. Figma has a bunch of tools that makes sure everything is aligned and creates these complex scalable systems through styles and components.
0:18:14 Image Icons
0:22:52 Scrolling Feature
Overflow behavior controls how users interact with content that extends beyond the frame/device’s dimensions.
0:24:23 Preview Mode: If we've set everything up right, we should be able to view what we've created and use the features we’ve added.