The Figma prototype challenge: 15 tips in 15 days
What we learned from 15 days of prototypes
Free Christmas Icon Sets And Vector Elements — Smashing Magazine
Everybody loves a nice freebie, right? To get you in the mood for the upcoming holidays, we collected some winter- and holiday-themed icon sets and vector elements that you can use in your projects for free. All icons and design elements in this collection can be downloaded for free. And, psst, they are perfect if you’re in need for some last-minute Christmas cards, gift tags, or wrapping paper, t
Designing Better Links For The Web — Smashing Magazine
There are so many websites out there that have not considered the overall usability of their visually impaired users. When it comes to designing better links and sending better emails, Slava Shestopalov has a few tips on how to improve your website’s experience while accessibility in mind.
Remote rendering: Shopify’s take on extensible UI - Shopify
A deep dive into the latest generation of technology that allows developers to extend Shopify’s UI.
What’s new in Figma: November 2021
A round-up of updates and improvements to Figma and FigJam
Responsive Layouts, Fewer Media Queries
We cannot talk about web development without talking about Responsive Design. It’s just a given these days and has been for many years. Media queries are a
New Stream Player customizations to boost your video experience
Today, we are extending the Stream Player vision with a series of new customization options to help you deliver the best end-user experience.
Coding Font Game
A tournament bracket UI where you pick your favorite between two coding fonts and your choices are whittled down all the way to a final winner. A clever way
Stay in the flow with redesigned comments
Introducing updates to comments in Figma and FigJam
Meet Touch Design For Mobile Interfaces, A New Smashing Book By Steven Hoober — Smashing Magazine
Meet “Touch Design for Mobile Interfaces”, our brand-new guide on designing for mobile with proven, universal, human-centric standards. 400 pages. Shipping starting in mid-January 2022. Jump to details and get the book right away.
From Good To Great In Dashboard Design: Research, Decluttering And Data Viz — Smashing Magazine
Dribbbleshots just might be the hotbed of questionable dashboards. Striking visuals, little context, and no research: all recipes for mediocrity. Mediocrity won’t do. We’ll pursue greatness. And in that pursuit, we’ll cover research, decluttering, and data visualization. In this article, Adam Fard will talk about research, decluttering, and data visualization, as well as how these things can make
The strong and weak forces of architecture
Good technical design decisions are very dependent on context. Teams that regularly work together on common goals are able to communicate regularly and negotiate changes quickly. These teams exhibit a strong force of alignment, and can make technology and design decisions that harness that strong force. As we zoom out in a larger organisation an increasingly weak force exists between teams and div
The Value Of Concept Testing As Part Of Product Design — Smashing Magazine
Concept testing is a blend of market and UX research, two disciplines that share many methods in common. You shouldn’t consider it anti-UX to also explore topics related to market acceptance. After all, what good is a usable product if it serves no purpose or doesn’t have any meaningful sized market willing to adopt it? Concept testing ideas before moving into a detailed design is good UX practice
Fixing the Drift in Shape Rotations
Steve Ruiz calls this post an "extra-obscure edition of design tool micro-UX," but I find it fascinating! If you select a bunch of elements in a design tool,
A Splash Of Color For Misty Days (November 2021 Desktop Wallpapers Edition) — Smashing Magazine
November is just around the corner, and with it, a new collection of desktop wallpapers to celebrate the beginning of the month. Designed by creatives from all across the globe, they come in versions with and without a calendar. Let’s make November colorful!
Some Articles About Accessibility I’ve Saved Recently IV
A guide to designing accessible, WCAG-compliant focus indicators — Sara Soueidan says you can make more accessible focus outlines by doing your own, rather
What’s new in Figma: October 2021
A round-up of updates and improvements to Figma and FigJam
Eye-Tracking In Mobile UX Research — Smashing Magazine
Eye-tracking, a method that measures where people are looking and for how long they are looking, became more accessible to UX research thanks to technology. It allows researchers to see through the users’ eyes and get insights about visual attention. This article explores the latest trends in the eye-tracking market and how the methodology can be included in the UX researcher’s toolbox.
Tips And Tricks For Evaluating UX/UI Designers — Smashing Magazine
Customers may start using your app because you offer a unique product, but user experience is what makes them stay. For that, you need excellent UX designers, and the know-how to spot them when hiring. This article is about the essentials of evaluating potential designers and design agencies you wish to hire. Getting this right is more important than ever.
Bridging The Gap Between Designers And Developers — Smashing Magazine
UXPin has recently launched a new feature called “Merge”. This tool aims to break through the chasms of design and development, all while improving the agility and quality our teams expect. This new technology may cause some rethink on how the whole design team and engineering team collaborates.
Waiting Room: Random Queueing and Custom Web/Mobile Apps
Today, we are announcing Waiting Room’s general availability and several new features that have user experience in mind — an alternative queueing method and support for custom web/mobile applications!
How To Implement Search Functionality In Your Nuxt App Using Algolia InstantSearch — Smashing Magazine
Many websites have some sort of search feature because it helps users navigate through their content easily. Implementing it the right way can be tricky and might not give a good user experience. In this tutorial, Miracle Onyenma will be integrating Algolia, a popular and powerful search service for the best experience on our Nuxt site.
Improving The Accessibility Of Your Markdown — Smashing Magazine
You can find Markdown in many places on the Internet. In this article, Eric Bailey covers different aspects of Markdown and how it interacts with other technology. At first, it may seem daunting since there is a lot of content to cover across a few different subject areas, but keep in mind that each tweak and update will have a direct impact on someone’s quality of life when using the web.
What’s new in Figma: September 2021
The features, fixes, and capabilities we've added to Figma and FigJam
Embracing Asymmetrical Design
I'll never forget one of Karen McGrane's great lessons to the world: truncation is not a content strategy. The idea is that just clipping off text
Practical API Design at Netflix, Part 2: Protobuf FieldMask for Mutation Operations
At Netflix, we heavily use gRPC for the purpose of backend to backend communication. This post explains how to use Protobuf FieldMask to design update and remove APIs.
Talk it out in Figma and FigJam
Introducing audio and cursor chat, two new ways to communicate without leaving Figma and FigJam
Figma for students and educators
How Figma can help during this back-to-school season
What’s new in Figma: August 2021
The features, fixes, and capabilities we've added to Figma and FigJam
Building a more collaborative design process
How our product design team uses FigJam
Inside Figma: a Q&A with our 2021 interns and new grads
Four Figmates share their advice, learnings, and reflections on joining Figma
How We Design Our APIs at Slack
More than five years ago, we launched the Slack Platform, giving developers an easy way to build apps in Slack and publish them in our App Directory. Today, millions of users bring their work into Slack, and those apps built by over 885,000 active developers on the platform are key to further improving collaboration in…
How to Build a Full-Stack Mobile Application With Flutter, Fauna, and GraphQL
Flutter is Google's UI framework used to create flexible, expressive cross-platform mobile applications. It is one of the fastest-growing frameworks for
Usability Pitfalls of Disabled Buttons, and How To Avoid Them — Smashing Magazine
How can we make disabled buttons more inclusive? When do they work well, and when do they fail on us? And finally, when do we actually need them, and how can we avoid them? In this article, Vitaly Friedman will take a look to common usability issues with disabled buttons, how to fix these issues and when disabling buttons actually makes sense. We’ll start from the beginning, looking into when disa
30 updates: recent features and fixes in Figma
A compilation of recent improvements that enhance your workflow in Figma
Introducing Flarability, Cloudflare’s Accessibility Employee Resource Group
I’m pleased to introduce myself and Cloudflare’s newest Employee Resource Group (ERG), Flarability. The 31st anniversary of the signing of the Americans with Disabilities Act is an ideal time to raise the subject of accessibility at Cloudflare and around the world.
How the Figma PM team builds products and processes
A look at their daily habits and weekly syncs
Yet Another Mobile Context Menu With No Indication it Can Scroll
Remember Tyler Hall's personal story of a UX moment where the popup sharing context menu on iOS had no visible indication that the content inside was
Inside Figma: a Q&A with our global sales team
A chat with the sales team about what they've learned and what they're looking forward to
Managing Focus Transitions in Slack
At Slack, we believe that designing an optimal keyboard experience is key to delivering a best-in-class product for all our customers. However, despite our design system components being individually accessible, we heard from keyboard users that we were still missing focus transitions in their end-to-end user experience. Non-sighted users who relied on a screenreader constantly…
Making A Strong Case For Accessibility — Smashing Magazine
Accessibility is often overlooked or bolted on to the end of a project from the experiences in Todd’s career in web development and design. The case for accessibility is something we as people who create and build things for the web should be implementing and advocating for from the inception of a project to the release or handoff and beyond.
Introducing Figma’s New York City hub
We have opened an office in New York City to better connect with Figmates and users
How News UK developed a multi-brand design system
The team at News UK shares their experience creating a design system across print, online, radio, and TV
npm audit: Broken by Design
Found 99 vulnerabilities (84 moderately irrelevant, 15 highly irrelevant)
An Introduction To Figma Interactive Components — Smashing Magazine
In this article, Emiliano explains why Figma Interactive Components (now in beta) will improve how we create prototypes. The new feature reduces the time and effort needed to create interactions by bringing down the cost of design exploration. There’s no need for previous Figma knowledge and experience — all you’ll need is a free Figma account if you’d like to try it out for yourself.
What does `font: 110%/1.4 system-ui` mean?
I use this line, or one like it, in a lot of quick demos. Not that it's not a production-worthy line of code—I just tend to be a bit more explicit on bigger
How To Run A UX Audit For A Major EdTech Platform (Case Study) — Smashing Magazine
A UX audit is a simple and efficient way to check whether design elements are performing their function. It’s also a good way to look at an existing design from a fresh perspective. This article is a case study of how a UX audit affects a UI. It explains how a famous educational platform can be analyzed edX against Jakob Nielsen’s usability guidelines. To get started, Mark Lankmiller shares all of
Figma's Series E
We have closed a new round of funding led by Durable Capital Partners
The Rise Of Design Thinking As A Problem Solving Strategy — Smashing Magazine
In the dynamic and unpredictable environments in which we work, even the most carefully crafted solutions can have a short shelf life. When we accept that our work is impermanent and our problem-solving abilities are limited, our goal can shift from delivering full solutions to developing tools that empower our users to adaptively design for themselves.
Are we in a new era of web design? What do we call it?
Una is calling it the new responsive. A nod to the era we were most certainly in, the era of responsive design. Where responsive design was fluid grids,
An Alternative Voice UI To Voice Assistants — Smashing Magazine
Voice assistants are currently the most popular use case for voice user interfaces. However, because voice assistants give feedback by talking to the user, assistants can only solve simple user tasks such as setting an alarm or playing music. In order for voice user interfaces to really break through, feedback to the user must be visual instead of auditive.
The five stages of an effective brainstorm
Tips from the research and marketing teams at Figma
Web Design Done Well: Making Use Of Audio — Smashing Magazine
Design often revolves around visuals, but the other senses deserve love too. In this article, we tune in to audio features that are making sites sing. Most of us have had the misfortune of crossing bad examples (auto-playing videos being a particularly egregious example) but audio can give web experiences a whole new dimension when applied well. What follows are some astounding sounds from the Wor
Inside Figma: How our product management team uses FigJam
Templates for you and your team to get started with everything from brainstorms to retrospectives.
How a Jenkins Job Broke our Jenkins UI
Artwork courtesy of the Jenkins project. At Slack we manage a sophisticated Jenkins infrastructure to continuously build and test our mobile apps before release. We have hundreds of jobs running in a variety of different environments. One day something very odd happened — our Jenkins UI stopped working although the jobs continued to run. This…
How To Build And Launch Powerful Responsive Websites With Editor X — Smashing Magazine
While web builders have been around for a long time, it wasn’t until recently that they became practical for professional use. Closing the gap between design and code has become the north star for many companies and we are seeing a wave of tools that deliver on this promise. One such product is Editor X, which we’ll review in this article.
Boost Your Skills Online: Smashing Workshops On Front-End And Design — Smashing Magazine
Our workshops bring in knowledgeable, kind folks from the community to explore real-life solutions to real-life problems, live, with you. Front-end and design are remarkably complex these days. That’s why we invite kind, smart folks from the community to run online workshops for all of us to learn together. And we have new ones coming up, and we’d like to kindly welcome you to join in.
Inside Maker Week: more than a hackathon
A behind-the-scenes look at a Figma tradition, and some of our favorite moments
Exploring color-contrast() for the First Time
Update! The color-contrast() function has been renamed to contrast-color(). See this article to get more recent information and use cases.
How To Bake Layers Of Accessibility Testing Into Your Process — Smashing Magazine
Accessibility experts Kate Kalcevich and Mike Gifford introduce readers to "layered accessibility testing”, a practice of using a variety of tools and approaches at different stages in the digital product lifecycle to catch accessibility issues early — when it’s easier and cheaper to fix them. In this article, Kate Kalcevich & Mike Gifford will share how to “layer” accessibility testing by using a