figma·Jun 7, 2017·3 min readCurated summary

Figma is powered by WebAssembly | Figma Blog

WebAssembly reduced Figma’s load time by more than three times after replacing its asm.js-based C++ runtime. The improvement came primarily from faster parsing, native-code compilation, and caching—not from a major reduction in compressed download size. Figma’s experience demonstrated that WebAssembly could deliver substantially faster, desktop-quality web applications, though browser support and implementation differences remained limitations. ## What WebAssembly Changes - WebAssembly is a compact binary format for machine code designed specifically for browsers. - Figma’s C++ code was a strong candidate because C++ can be compiled directly to WebAssembly. - Before WebAssembly, Figma used asm.js, a restricted JavaScript subset that represents memory as a large numeric array. - WebAssembly preserves asm.js’s limitations: - It primarily loads and stores numbers. - It must call JavaScript for browser APIs such as the DOM and networking. - It remains subject to the browser sandbox. ## Why WebAssembly Is Faster Than asm.js - **Smaller and faster to parse:** WebAssembly’s binary format transfers efficiently and parses around 20 times faster than asm.js. - **Ahead-of-time optimization:** LLVM optimizes the C++ code before compilation, allowing browsers to translate it directly to native code. - **Effective caching:** Browsers can cache the translated native code, making subsequent loads nearly free. - **Native 64-bit integer support:** WebAssembly avoids the slower emulation required by JavaScript’s 53-bit integer limitation. - **Less runtime optimization work:** Unlike JavaScript, WebAssembly does not require extensive browser optimization passes for code that was already compiled and optimized. ## Figma’s Load-Time Results - Figma measured load time from application initialization through downloading and rendering an entire design for the first time. - Switching from asm.js to WebAssembly improved load time by more than three times across document sizes. - The gain was especially meaningful because Figma users often work with large documents and switch between them frequently. - Subsequent loads could benefit further from cached WebAssembly-to-native translations. - The compressed download size improved only slightly because compressed asm.js was already close in size to compressed WebAssembly. ## Browser Support Limitations - At the time of publication, WebAssembly was enabled by default in Firefox and Chrome. - Edge and Safari were still developing their implementations. - Figma enabled WebAssembly only in Firefox because Chrome’s implementation had blocking issues, including the lack of caching for translated WebAssembly code. - These browser-specific differences affected whether the performance benefits could be consistently delivered. Figma’s results suggested that teams with substantial C or C++ code should seriously consider WebAssembly for performance-sensitive web applications. The largest benefits were faster startup and reusable native-code caching, while download-size improvements were comparatively modest.

Read original(opens in new tab)

JavaScriptWebassemblyWebglC Plus Plus+3

figma·Jun 4, 2017·2 min readCurated summary

How one designer escaped the export-upload abyss | Figma Blog

The post argues that traditional designer-developer handoff creates unnecessary work, outdated files, and communication problems. At Pivotal, designer Colby Sato replaced repeated image exports and uploads with Figma’s browser-based, collaborative workflow. This saved roughly two days per project and made design critiques more focused and efficient. ## The Export-and-Upload Problem - Colby exported design frames as images and uploaded them to Pivotal Tracker engineering cards. - He repeated this process 15–20 times per project as designs evolved. - Searching through hundreds of engineering cards was time-consuming. - Missed updates sometimes caused engineers to implement outdated designs. - The process wasted developer time and made collaboration frustrating. ## Figma as a Shared Source of Truth - Figma files were accessible in the browser, always current, and shareable through links. - Colby could add a Figma link when creating an engineering card instead of updating images repeatedly. - Comments attached directly to design frames provided functional context. - The workflow eliminated uncertainty about which design version engineers should use. - Colby estimated it saved him two days of work per project. ## More Effective Design Reviews - Pivotal’s weekly critiques had previously relied on post-it notes and verbal explanations. - Figma comments stayed attached to the relevant design, making feedback easier to understand. - Colby could observe where engineers were focusing in the file through their cursor activity. - He could redirect reviewers toward areas where feedback was most valuable. - Reviews became faster, more contextual, and more collaborative. Figma ultimately shifted Pivotal’s focus from tracking files and feedback to improving the product itself. The post recommends using a shared, continuously updated design workspace to reduce handoff friction and enable stronger collaboration between designers and engineers.

Read original(opens in new tab)

FigmaDesign SystemsUser InterfaceDesign Collaboration+2

figma·May 25, 2017·2 min readCurated summary

Tips for using Constraints in your workflow

Figma’s constraints feature helps designers build layouts that adapt across different screen sizes and contexts. By anchoring elements to edges, centers, or grids, designs can remain structurally consistent instead of requiring separate manual adjustments. The post presents five practical applications, from simple button placement to flexible navigation bars, table cells, and playful illustrations. ## Pinning Buttons to Corners - Set an action button’s constraints to the bottom and right sides of its parent frame. - This keeps floating action buttons in a consistent location as the screen expands. ## Combining Components and Constraints - Constrain important elements within a frame, then convert the frame into a reusable component. - Duplicate the component for different screen sizes. - Changes to the original—such as colors or text sizes—propagate to all instances, making responsive variations easier to manage. ## Building Flexible Navigation Bars with Grids - Nest a navigation bar frame at the bottom of a phone-screen frame. - Set its constraints to **left & right** and **bottom** so it stretches with the screen. - Apply a layout grid with the **stretch** type. - Place buttons in grid columns and center-constrain them so they reposition as the screen changes. ## Creating Reusable Table Cells - Group related content, such as an avatar and text, and constrain it to the center-left of the cell. - Group action text and a rounded rectangle into a button, then constrain it to the center-right. - The cell’s contents remain attached to their intended sides across different frame widths. ## Experimenting with Illustrations - Horizontal and vertical constraints can also be applied creatively to illustrations. - Stretching constrained artwork can produce humorous distortions and playful effects. Constraints are most useful when combined with components and grids. Setting them thoughtfully allows one design to adapt across many screen sizes while reducing repetitive layout work.

Read original(opens in new tab)

FigmaUser InterfaceResponsive DesignComponents+3

figma·May 21, 2017·2 min readCurated summary

How Braintree Cut Time Spent on Design Critiques by 50% | Figma Blog

Braintree redesigned its critique process by replacing static presentations and follow-up meetings with real-time collaboration in Figma. Designers worked together in the same file during Slack audio calls, making and demonstrating changes immediately. This cut critique time by roughly 50% while also improving collaboration and simplifying developer hand-offs. ## Challenges with Traditional Critiques - Designers typically presented work, collected feedback, and worked alone afterward. - Feedback could be misunderstood or difficult to apply correctly. - Follow-up meetings were needed to review revisions and address new issues. - After PayPal acquired Braintree, multiple design teams, style guides, services, and developer groups increased coordination complexity. ## Finding Figma - Braintree’s Developer Experience team experimented with new critique methods. - Figma’s browser-based, collaborative files allowed designers to work together regardless of device or location. - Designers joined an audio Slack call and opened the same file instead of scheduling several in-person meetings. - Figma’s observation mode let one designer follow another’s screen and move through different frames in real time. ## Collaborative Work Instead of Static Feedback - Designers could duplicate an artboard and make changes while discussing the design. - Feedback became concrete and immediately understandable rather than being recorded as notes for later. - Team members brainstormed, explored alternatives, and combined the strongest elements of multiple designs. - Craig Wattrus estimated that critiques took 50% less time because collaborators could demonstrate ideas directly. - The process often produced better results than one designer working independently and applying feedback later. ## Faster Developer Hand-off - Designers shared a single link with developers instead of repeatedly exporting updated files. - Designers could explain interactions and demonstrate behavior directly in the shared file. - Developers received answers immediately, reducing long message exchanges. - Design and engineering teams needed fewer meetings to clarify how interfaces were intended to work. Braintree’s experience suggests that real-time, shared design files can turn critiques into productive collaboration sessions. Teams looking to reduce review cycles and improve design-to-development communication should consider working together directly in the design artifact rather than relying on presentation-based feedback.

Read original(opens in new tab)

FigmaUser ExperienceSlackReal Time Collaboration+2

figma·May 19, 2017·3 min readCurated summary

Reflecting on Figma’s First Year | Figma Blog

Figma’s first year focused on proving that a browser-based design tool could deliver both powerful graphics performance and trustworthy collaboration. The company moved from being dismissed as a “toy” to becoming a serious platform through rapid feature releases, performance improvements, and better support for existing Sketch workflows. Its central insight was that multiplayer editing creates not only collaboration, but also a shared source of truth for entire product teams. ## Building a Browser-Based Design Platform - Figma faced major technical challenges in rendering complex graphics smoothly in a browser. - It also had to persuade designers that a web-based tool could be reliable enough for professional work. - The team spent its first year speaking with designers, engineers, and product managers to understand the needs of growing organizations. - Figma invested heavily in: - Faster file loading and rendering - Workflow improvements and polish - Continued refinement of Sketch import - Because releases came so quickly, the company collected its major updates in one anniversary retrospective. ## Collaborative Design and Multiplayer Editing - Public multiplayer editing launched on September 28, 2016, making Figma the first design tool to offer simultaneous editing. - Designers initially reacted both enthusiastically and skeptically to the idea of “pair design.” - After a year, teams were using multiplayer editing to: - Ship products under tight deadlines - Mentor designers remotely - Conduct more efficient design critiques - The larger benefit was a single source of truth: - Files could be shared through a persistent URL. - Updates appeared at the same location without requiring teams to synchronize assets manually. - Teams avoided overwritten files and outdated versions. - Different roles could work directly with the design: - Copywriters could test messaging. - Developers could inspect design attributes for implementation. - Product managers could monitor progress without relying on Slack updates. ## Components and Design Systems - As design became more central to product development, companies needed systems for maintaining consistent UI elements across teams and files. - Figma introduced components on December 8, 2016, allowing designers to synchronize reusable elements such as navigation menus and status bars. - Component overrides let designers customize individual instances—for example, changing color or typography—without disconnecting them from the underlying component. - This balanced flexibility with consistency, allowing teams to benefit from a broader design system while still adapting individual designs. Figma’s first-year progress suggests that browser-based design succeeds when performance, compatibility, and collaboration are treated as equally important. Its persistent shared files and emerging design-system features aimed to make the design process more connected across the entire product team.

Read original(opens in new tab)

FigmaDesign SystemsCollaborative DesignMultiplayer Editing+2

figma·May 18, 2017·1 min readCurated summary

Figma's two-factor authentication | Figma Blog

Figma introduced two-factor authentication (2FA) to give users additional protection if their passwords are compromised. Users can receive codes by SMS or an authenticator app, with recovery codes available if they lose access to their phone. After verification, 2FA remains valid for 21 days unless the user logs in from a new device or signs back in after logging out. ## Enabling Two-Factor Authentication - Users can activate 2FA from the account settings menu in Figma. - Supported verification methods include: - SMS login codes - Authenticator apps such as Google Authenticator - The feature works with all mobile phones. ## Recovery and Login Behavior - Figma provides recovery codes in the account settings. - Users are encouraged to record these codes in case they lose their phone. - 2FA is required when: - Logging in on a new device - Signing back in after logging out - Once authenticated, the verification remains valid for 21 days. Figma recommended enabling 2FA as an additional account-security measure and indicated that more security features were planned for the future.

Read original(opens in new tab)

FigmaTwo Factor AuthenticationGoogle AuthenticatorSms+1

figma·May 16, 2017·2 min readCurated summary

Are hackathons the answer to the tech designer shortage? | Figma Blog

Hackathons could help address the tech industry’s designer shortage by connecting design students with engineers, rapid product development, and recruiting companies. However, traditional hackathons often make designers feel unwelcome because they emphasize coding and seem aimed exclusively at developers. Hack@Brown shows that deliberate outreach and inclusive programming can turn hackathons into an effective pathway into product design careers. ## Making Hackathons Welcoming to Designers - Many design students believe they do not belong at hackathons because they cannot code or view tech companies as “selling out.” - Hack@Brown changed its branding to appear more professional and appealing to designers. - Organizers introduced dedicated UX and UI prizes. - They contacted design clubs nationwide and paid travel costs for students to attend. - The event’s design team grew from four members to six, helping ensure designers’ concerns shaped the experience. ## The Missing Path into Tech Design - Engineers have established routes into technology through coding education, projects, and recruiting pipelines; designers often lack an equivalent path. - Even invited designers sometimes left after seeing recruiting booths focused on engineers, reinforcing the sense that they did not fit in. - Companies need to take responsibility for finding potential designers rather than waiting for them to enter traditional tech channels. - Personal mentorship can be decisive: Atty Eleti discovered his potential as a designer after encouragement from Figma engineer Jessica Liu and designer Alice Lee. ## Hackathons as a Recruiting Funnel - Hack@Brown grew from 15–20 designers in 2013 to more than 100 in 2017—about 20% of attendees. - Companies including Facebook, Kayak, LinkedIn, Dropbox, IBM, and GE were increasing designer recruitment. - Facebook representatives attended to identify students with potential and followed up with attendees, including campus visits. - Recruiters seek designers with a combination of skills that remains difficult to find because product design is still a relatively young field. - Hackathons give companies an opportunity to meet promising candidates early and show students that tech design offers substantial career opportunities. Companies and hackathon organizers should actively invite, support, and mentor designers. With inclusive branding, design-specific challenges, financial assistance, and visible designer participation, hackathons can become a meaningful bridge into tech careers rather than developer-only events.

Read original(opens in new tab)

FigmaUser ExperienceProduct DesignUser Interface+2

figma·May 14, 2017·2 min readCurated summary

Women Who Design | Figma Blog

The article argues that the tech industry’s claim that qualified women are difficult to find is false. Women Who Design, a searchable directory created by Jules Forrest, demonstrates the breadth of talented female designers in tech and provides a resource for recruiting, networking, and mentorship. Its central message is simple: organizations can find women for leadership roles, teams, and conferences if they make the effort to look. ## The Lack of Visibility for Women in Tech - Women in technology often receive less attention than male peers despite having comparable expertise. - Earlier efforts, including a list of 1,000 women in tech and directories of female venture capital investors, challenged the idea that qualified women are scarce. - These initiatives do not solve systemic gender discrimination, but they make underrepresented talent easier to discover. ## Women Who Design - Product designer Jules Forrest created **Women Who Design**, a directory of female designers in the technology industry. - Users can filter the list by categories such as: - Founder - UX research - Other design specialties and leadership roles - The directory is intended for: - Recruiting designers - Finding professional role models - Discovering people to follow or work with - Forrest planned to expand the directory through a nomination form and allowed people to opt out if they did not want to be identified or searchable as women in design. ## The Community Response - Forrest was inspired by a tweet from Shopify design lead Helen Tran, who asked followers to name female design influencers. - The tweet generated: - 256 retweets - 704 likes - 368 replies - More than 450 suggested names - Responses came from prominent design leaders at organizations including BuzzFeed and Google Ventures. - The reaction showed that the design community already knew many talented women; the problem was that they were not always included in public conversations. ## Balancing Representation and Labels - Forrest recognized a tension between highlighting women by gender and avoiding the impression that gender defines their professional value. - She also emphasized that visibility matters, particularly for younger women who need to see peers and leaders they can identify with. - The directory reflects an attempt to improve representation while acknowledging the limitations of categorizing people primarily by gender. The article concludes that “there aren’t enough qualified women” is not a credible excuse for hiring decisions or conference lineups. Employers and event organizers should use resources like Women Who Design to broaden their searches and make overlooked talent visible.

Read original(opens in new tab)

User ExperienceProduct DesignDesign RecruitingDesign Community+2

figma·May 8, 2017·2 min readCurated summary

Figma Mirror for Android | Figma Blog

Figma introduced Mirror for Android on May 9, 2017, bringing real-time mobile previews to Android users and designers. The app reflects selected Figma frames on an Android device and updates instantly as designs change on a computer. Figma also offered the same functionality through a mobile browser, making the feature accessible without installing the app. ## Real-Time Design Mirroring - Users can select a frame in a Figma file on their computer and view it immediately on an Android phone. - Design edits made on the computer are reflected instantly in the mobile preview. - The feature helps designers test how their work appears and behaves on an actual mobile device. - Mirror was already available for iOS before the Android release. ## Browser-Based Alternative - Users who do not want to install the Android app can visit `figma.com/mobile-app` in a mobile browser. - The browser version provides the same basic mirroring functionality. ## Support for Android Design - Android accounted for roughly 52% of the U.S. smartphone market and 82% of the global market at the time. - Figma included preset frame sizes for several popular Android devices, reducing the need to create device layouts from scratch. Figma Mirror for Android made mobile design testing more inclusive and convenient, while the browser option provided a no-download alternative.

Read original(opens in new tab)

FigmaAndroidiOSMobile App Development+1

figma·May 3, 2017·2 min readCurated summary

New faces at the Figma helm | Figma Blog

Figma is entering a new phase as demand for design and collaborative tools grows across the technology industry. To support that growth, CEO Dylan Field announces Eric Wittman as the company’s first COO and Kris Rasmussen as Vice President of Engineering. Their experience scaling collaboration-focused businesses will help Figma expand its operations, revenue, technology, and team. ## Figma’s Growth Opportunity - Companies increasingly view design as central to creating products customers value. - Large organizations such as IBM and GE are expanding their design teams, while Facebook has pursued a high designer-to-engineer ratio. - Figma argues that the tools available to designers have not kept pace with this demand. - Improving collaboration remains the company’s guiding priority. ## Eric Wittman: Operations, Strategy, and Revenue - Wittman joins after leading Atlassian’s Developer Tools business, including Bitbucket. - As COO, he will focus on: - Recruiting and finance processes - Go-to-market strategy - Revenue and business operations - Company strategy and values - His career spans: - Customer support and product management at Macromedia, where he eventually led Flash product management - CEO of music player company Songbird - General manager of Developer Tools at Atlassian - Figma highlights his unusual combination of operational expertise and strong product enthusiasm. - Before the announcement, he had already helped Figma launch its pricing model and refine its strategic direction. ## Kris Rasmussen: Engineering Leadership - Rasmussen initially joined Figma as a part-time contractor but quickly became an influential, informal leader. - He is appointed Vice President of Engineering and will oversee major engineering initiatives and technical-team development. - His background includes: - Leading engineering at Asana during its early growth - Scaling engineering at Aptana, a web-application developer-tools company - Building personal projects involving 3D graphics - Figma values his ability to resolve disagreements, identify necessary actions, and combine technical skill with leadership. - His primary mission will be building a world-class engineering organization and infrastructure for collaborative design tools. ## Continued Hiring - Figma says it is still early in its development and expects significant opportunities and challenges ahead. - The company invites engineers, designers, writers, and product managers who are passionate about design to apply for open roles. Figma’s leadership changes are intended to turn growing demand for collaborative design software into scalable business and technical execution. Wittman will strengthen operations and commercial strategy, while Rasmussen will lead the engineering organization needed for Figma’s next stage.

Read original(opens in new tab)

FigmaDesign CollaborationSaasDeveloper Tools+2

figma·Apr 26, 2017·2 min readCurated summary

5 books that shaped the design approach of Airbnb’s Jon Gold | Figma Blog

Jem Gold’s design approach combines systems thinking, human-centered technology, disciplined focus, mindfulness, and functional programming. The five books she recommends show how design can be treated as a generative process—one that connects creative practice with engineering and tools that augment human ability. ## Designing Programmes: Design as a System - Karl Gerstner’s *Designing Programmes* presents design as a process that generates assets rather than relying on humans to create every final output manually. - Though focused on layouts, logos, and typography, its ideas remain relevant to modern UI and design systems. - Gold values the concept of a flexible pipeline that people can shape, with the system producing consistent results. ## 10% Happier: Creating Space for Better Decisions - Dan Harris’s memoir about meditation influenced Gold’s design process and outlook. - Meditation helps her avoid immediate, visceral reactions and take time to investigate the best response. - She especially appreciates Harris’s skepticism toward mystical or “woo-woo” claims, making the book a practical introduction to meditation. ## The Dream Machine: Computers as Creative Partners - *The Dream Machine* explores J. C. R. Licklider’s vision of “man-computer symbiosis,” in which computers enhance human intelligence. - It describes researchers who rejected IBM’s slow, punch-card-based model of computing in favor of interactive systems people could enjoy using. - Gold identifies with their rebellious belief that technology should augment human creativity rather than merely automate routine tasks. ## Deep Work: Protecting Creative Focus - Cal Newport’s *Deep Work* argues that social media fragments attention and prevents sustained, original thinking. - Gold responded by eliminating social media for a month and scheduling dedicated blocks for creative projects. - When she felt the urge to check distractions, she replaced the habit with activities such as running or reading. - The practice helped her preserve focus and create space for ideas to develop. ## Functional Programming: Building from Small Primitives - *Professor Frisby’s Mostly Adequate Guide to Functional Programming* introduces functional programming through a short, approachable, free online book. - The paradigm breaks problems into small, composable units that can be rearranged and combined. - Gold applies this principle to design systems: instead of starting with a large page and breaking it down, designers can begin with basic primitives and build upward. - This approach connects programming concepts directly to scalable, reusable design work. Together, these books recommend a design practice built from composable systems, deliberate attention, skepticism, and technology that expands human creativity.

Read original(opens in new tab)

AIDesign SystemsReactTypography+2

figma·Apr 11, 2017·3 min readCurated summary

An alternative approach to rate limiting | Figma Blog

Figma built a Redis-backed rate limiter to protect its web application from excessive traffic and spam. The system needed to work across multiple servers, add minimal latency, remove stale data efficiently, remain accurate, and use little memory. Common algorithms each met some of these goals, but introduced trade-offs involving atomicity, burst behavior, or memory consumption. ## Requirements and Redis - Rate limits cap requests from a user or IP within a time period. - Figma needed shared state because its application ran on multiple machines. - Redis was preferred over PostgreSQL because it provides: - Faster in-memory reads and writes - Built-in expiration for stale tracking data - Efficient storage for rate-limit state ## Token Bucket - Stores each user’s last-request timestamp and remaining token count in a Redis hash. - Tokens refill over time; a request is rejected when no tokens remain. - It is memory-efficient and conceptually elegant. - Its read-then-write operations are not atomic: - Two servers can read the same remaining token count. - Both may accept a request even though only one token was available. - Redis locks could prevent this race but would slow concurrent requests and add complexity. - Lua scripting could make the operations atomic, but Figma avoided introducing that complexity. ## Fixed Window Counters - Stores a request count for each user and fixed time interval, such as one Redis key per minute. - Each request atomically increments its interval’s counter. - Keys expire after the interval, preventing stale data from accumulating. - The approach is simple, memory-efficient, and avoids the token bucket’s race condition. - Its major flaw is boundary bursts: - With a five-request-per-minute limit, a user could send five requests at the end of one minute and five more immediately afterward. - This allows up to twice the intended traffic over a short sliding period. ## Sliding Window Logs - A sliding window log records the timestamps of individual requests. - Older timestamps can be removed as the window advances, and the remaining entries provide an accurate count. - This avoids the boundary problem of fixed windows. - The trade-off is memory usage: users making many requests require many timestamps to be stored. ## The Central Trade-off - Token buckets use little memory but require careful handling of distributed atomicity. - Fixed counters are atomic and efficient but can permit bursts at window boundaries. - Sliding logs are accurate but consume more memory. - Figma’s rate limiter was designed around balancing these competing concerns rather than choosing the theoretically simplest algorithm. The practical lesson is to select a rate-limiting strategy based on the required accuracy, concurrency model, storage system, and memory budget. Redis is a strong fit for distributed rate limiting, but the algorithm must account for both race conditions and burst behavior.

Read original(opens in new tab)

PostgreSQLDistributed SystemsRedisRate Limiting+2

figma·Mar 29, 2017·2 min readCurated summary

Figma’s new icon | Figma Blog

Figma’s 2017 icon redesign reflects the company’s growth and broader design philosophy. Rather than treating the icon as a standalone mark, Figma built it around three ideas: fundamental design elements, playful experimentation, and modular systems. The result is a bright, flexible icon made from simple shapes that represents both Figma’s product and its approach to design. ## Celebrating the Fundamentals of Design - All designs can be reduced to basic elements such as points, lines, and shapes. - Figma’s own tools follow this principle: a relatively small set of carefully integrated functions can produce complex results. - The icon celebrates these foundational building blocks, echoing traditions associated with Bauhaus and other design movements. - Its simple forms represent Figma’s goal of empowering designers to create sophisticated work from elemental components. ## Encouraging Play - The icon’s bright colors and block-like shapes were inspired by children’s building blocks. - Figma views experimentation and play as important ways to discover new solutions. - An open, playful design process can produce more creative and unexpected outcomes. - The icon is intended to communicate the same openness and enjoyment that Figma hopes to enable in its users’ workflows. ## Design as a System - Digital products must work across many screen sizes, devices, operating systems, and connection conditions. - Modular systems and reusable components are therefore more effective than one-off designs. - Figma favors rules-based, vector design because it can adapt to different environments more reliably than fixed pixels. - The new icon is constructed from three simple shapes arranged on a modular grid, reinforcing the idea of flexible, reusable design components. - This concept connects to Figma features such as team libraries, which help designers build and maintain systems. The new icon extends Figma’s identity while expressing its core beliefs: strong design starts with fundamentals, creativity benefits from play, and digital work is most powerful when built as an adaptable system.

Read original(opens in new tab)

FigmaDesign SystemsResponsive DesignVector Design+2

figma·Mar 19, 2017·2 min readCurated summary

Should designers learn to code? | Figma Blog

The article argues that learning to code is not a universal requirement for designers. Alex Cornell chose filmmaking and motion graphics instead because his engineering-heavy startup already had strong coding expertise, and that specialization later helped him launch Facebook Live. While coding can improve collaboration with engineers, designers should choose skills based on their interests, team needs, and career goals. ## Coding Is a Personal Choice - In 2007, deciding whether to code was viewed as an individual career choice rather than an expected designer milestone. - Cornell worked alongside highly experienced engineers, so learning to code would have duplicated an existing team strength. - He chose filmmaking, After Effects, and Premiere because he found motion graphics more engaging and useful. - Without modern prototyping tools, he used After Effects to demonstrate animated interface ideas. ## The Value of Learning Adjacent Skills - Cornell sometimes wonders what learning to code might have enabled, but does not fundamentally regret his decision. - His design career benefited from understanding how engineers think and how to translate design concepts into technical language. - At Facebook, coding is helpful but not essential to his role. - Specializing in a complementary discipline can make a team stronger than having everyone develop the same skills. ## The Boundary Between Design and Code Is Blurring - Modern tools such as Framer and Origami combine visual design with logic and interaction. - Designers increasingly work with systems that sit between traditional design and programming. - Because roles and tools overlap, the question is no longer a simple choice between coding and not coding. - There is no universally correct answer; the best path depends on the individual. ## Writing and Communication Matter - Cornell recommends writing and communication or presentation as especially valuable alternatives to coding. - Strong design or technical execution may have little impact if the designer cannot persuade others to support the idea. - Communication can take many forms: - Speaking in meetings - Presentations and slide decks - Films or demonstrations - Clear written explanations - These skills combine practical communication with emotional intelligence, helping designers influence decisions and move projects forward. - Cornell also cautions against leaving school too early because writing, communication, and interpersonal skills are harder to acquire independently than technical skills. Designers should learn to code when they are genuinely interested in it or when it serves their goals—not because it has become an expected rite of passage. Building complementary strengths, particularly in writing and communication, can be just as valuable.

Read original(opens in new tab)

User ExperiencePrototypingFramerMotion Graphics+3

figma·Mar 13, 2017·2 min readCurated summary

The 6 design trends John Maeda predicted in his State of the Union | Figma Blog

John Maeda’s 2017 *Design in Tech Report* predicted rapid growth and transformation in product design. The article argues that companies increasingly need designers because technology has become easy to build, making user experience and emotional relevance key differentiators. However, fragmented tools and outdated education remain major challenges. ## Designer Hiring Surges - Major corporations are expanding their product design teams. - Companies such as Facebook, Google, and Amazon reportedly hired 65% more designers in the previous year. - More than 35 design agencies were acquired by large companies over two years. - As app development becomes commoditized, design determines how useful and meaningful products feel to people. ## More Inclusive Design - Technology’s broader reach requires products designed for people from varied backgrounds and experiences. - Companies including Airbnb, Slack, Google, and Microsoft were highlighted as leaders in inclusive design. - Inclusion is becoming both a social responsibility and a product-quality requirement. ## Design Education Falls Behind - Many design programs remain focused on print-era disciplines such as traditional typography. - Schools often fail to teach digital product design for web and mobile platforms. - More than two-thirds of surveyed students said they learned digital skills independently through resources such as Lynda.com. - Maeda expects educational institutions to change slowly because their structures and processes evolve deliberately. ## Design-Focused Investment - Venture capital is showing greater interest in companies built around design. - Two VC firms were reportedly launching with design-focused investment strategies. - Designers themselves show entrepreneurial interest: 80% of those surveyed said they would start a company if they had sufficient funding. ## Growing Number of Design Tools - Product design tools remain fragmented, supporting different workflows rather than one unified process. - Many companies are attempting to streamline collaboration and production. - Maeda warned that increasingly sophisticated tools could create more opportunities for machine intelligence and eventually reduce demand for some design work. ## Emerging Specializations - Voice-interface design is growing alongside products such as Amazon Alexa. - Cybersecurity is creating demand for specialized designers. - China is expected to become increasingly influential in the global design landscape. The outlook for technology and product design is strong, but the industry must address outdated education and disconnected workflows. Designers, companies hiring them, and toolmakers all have opportunities—especially to create more unified, collaborative design processes.

Read original(opens in new tab)

FigmaProduct DesignWeb DesignUser Interface Design+4