I love creating smooth transitions in Figma, both for concepts and final designs. But for extra finesse and control over easing types, you should export from Figma into Adobe After Effects and finish the job there—let me show you! Smooth(er) Transitions in Figma and Adobe After Effects Smooth transitions in apps and websites are where… Continue reading Make Smooth Transitions with Easing in Figma and After Effects
Tag: I’ve
Why blockchain and Web 3 user interfaces will suck for a while
How Web 2.0 grumpiness + Web 3.0 hubris are contributing to terrible user experiences on the cutting edge of tech. Statler and Waldorf definitely aren’t interested in Web 3. Source: https://www.youtube.com/watch?v=RF62EGPppFU My point in a nutshell: Web 3 people are generally not interested in lessons from the past, and experienced tech people don’t need Web 3… Continue reading Why blockchain and Web 3 user interfaces will suck for a while
I neglected Duolingo for 20 days after signing up. Here’s every email they sent me.
About 3 weeks ago, I signed up to Duolingo intending to learn Swahili every day for about a month. Why? To learn something new, to make some progress with a language I’ve been casually interested in for some time, and to document to process from a UX perspective. What went wrong? Not to be dramatic,… Continue reading I neglected Duolingo for 20 days after signing up. Here’s every email they sent me.
What comes after customer-centricity?
Read this and get ready for it. For many years now, I’ve been fascinated by the timeline shown below and pondering what lies beyond the Age of the Customer. These days, I’ve got a pretty good idea about what’s next. The Age of the Customer timeline. Source: Forrester Research First, let’s unpack this timeline and understand how… Continue reading What comes after customer-centricity?
How to Conform to WCAG (Web Content Accessibility Guidelines) in Email
* { box-sizing: border-box; } body {margin: 0;}*{box-sizing:border-box;}body{margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;} WCAG (the Web Content Accessibility Guidelines) make the web a more accessible place for everyone. They’re written for web content, not email content, but as the two have a lot in common, conforming to WCAG lays a good foundation for applying accessibility to email. So, how do… Continue reading How to Conform to WCAG (Web Content Accessibility Guidelines) in Email
How to Build a Responsive Slider With Swiper.js
* { box-sizing: border-box; } body {margin: 0;}*{box-sizing:border-box;}body{margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;} Have you ever built an advanced slider for a project? If so, you might have taken advantage of any one of a number of JavaScript carousels. In the past, I’ve covered two of them: slick and Owl. Today, I’ll introduce another well-known one: Swiper. Ready to learn… Continue reading How to Build a Responsive Slider With Swiper.js
How to survive a design career and avoid burnout (Part 2)
[unable to retrieve full-text content] Hi, people in the UX Design and Product world. This post is the second in a series I’m writing, based on conversations I’ve had with Product and Experience Designers and leaders in the field, who prosper despite working in some really harsh environments. And when I say “harsh”, I’m talking… Continue reading How to survive a design career and avoid burnout (Part 2)
Design lessons from the National Football League (NFL)
[unable to retrieve full-text content] While growing up in Western PA, like most kids, I grew up loving and playing football and becoming a Pittsburgh Steelers fan. As NFL devotees, we endured a surreal 2020 football season with the pandemic from empty stands replaced by cardboard fans to injury reports containing COVID19 infections. Yet, with… Continue reading Design lessons from the National Football League (NFL)
Is It Time to Reset HTML?
HTML is one of the foundational building blocks of the Web. But just as web design best practices and techniques change over time, so does the code we use. As HTML evolves, some of its older markup has been deprecated while other parts have been repurposed. Does that create more problems for us, though? Would… Continue reading Is It Time to Reset HTML?
A Comprehensive Guide to Flexbox Alignment
Alignment is probably the most confusing aspect of flexbox. The flexbox layout module has a handful of alignment properties that behave differently under different circumstances, and when using them you might not necessarily understand what is happening or why. However, if you know what to pay attention to, alignment is less complicated than it first… Continue reading A Comprehensive Guide to Flexbox Alignment
How to Preserve the Menu State on Page Load (Using Local Storage)
What You’ll Be Creating In this tutorial, we’ll create a simple static site with Tailwind CSS and then learn how to preserve its menu state on page load. The first time we visit the site, the menu will be hidden. However, as soon as we open it and close the browser, we’ll use local storage… Continue reading How to Preserve the Menu State on Page Load (Using Local Storage)
The role of Reflection in the design process
[unable to retrieve full-text content] The often-overlooked last step. In product design, when we release a feature into the wild, we can expect a degree of objectivity in the feedback we get. We can tell if our designs are helping or hurting based on the feedback and metrics after we ship. Getting my hands on these metrics… Continue reading The role of Reflection in the design process
7 Skills You Need To Thrive As A Web Designer In 2021
Web design is an ever-evolving field. Those of us that have been in the industry a long time (i.e., six months plus) have seen the launch of more products, the establishment of more ideas, and the promise of more growth than most industries see over a whole career. While the tools we use, the terminology… Continue reading 7 Skills You Need To Thrive As A Web Designer In 2021
How to build tech that does things differently
[unable to retrieve full-text content] Data ethics principles and processes are useful, but they are often of limited use when it comes to addressing the social and environmental harms of the data economy. This post is about using creative R&D to build data technologies that embed a different set of values from the ground up,… Continue reading How to build tech that does things differently
How to Build a Fake AJAX “Load More” Mechanism (JavaScript Tutorial)
The other day I was working on a WordPress project that used ACF (Advanced Custom Fields) Pro’s flexible content. If you aren’t familiar with this field, imagine it as a miniature of the Gutenberg and Elementor builders that gives you the ability to define different types of layouts. So, on this project, the design required… Continue reading How to Build a Fake AJAX “Load More” Mechanism (JavaScript Tutorial)
Creating a Future-Proof Responsive Email Without Media Queries
What You’ll Be Creating Using this method you can create an email that has responsiveness baked in to the layout, without any need for CSS or media queries in the <head>, so that even in the worst case scenario of email rendering, your layout will remain intact. Is Developing HTML Email Still Hard? HTML email has… Continue reading Creating a Future-Proof Responsive Email Without Media Queries
The Latest Research for Web Designers, December 2020
2020 has been an interesting year, to say the least. And although I’m sure many of you can’t wait until the calendar flips ahead to 2021, it doesn’t look as though we’re going to be able to say goodbye to 2020 so easily. Many of the changes we’ve had to make this year are now… Continue reading The Latest Research for Web Designers, December 2020
“Roxxe” Shopify Theme Review: Multipurpose, Easy to Set up
In this theme review we’ll take a look through a multipurpose Shopify theme called Roxxe. Shopify allows you to quickly create your own online store, and when armed with the right theme you can be up and running in no time. So let’s have a look at Roxxe, talk about its pros and cons, and… Continue reading “Roxxe” Shopify Theme Review: Multipurpose, Easy to Set up
Design with the web in mind
[unable to retrieve full-text content] Back button, URL design, keyboard shortcuts, and other things we often forget about. When designing an application, there are 3 major variations — mobile app, web app, and desktop app. *It’s actually more complicated than this, but we’ll ignore that for now. Check out my other post to find out more about the different… Continue reading Design with the web in mind
35 Best Procreate Brushes For Procreate App
41 Shares Creative Procreate brushes for realistic sketching effects, watercolor, patterns, textures, and pencil brushes for illustrations and drawing. Procreate is the most unique and most powerful drawing and illustration app for iPad. This app have tons of features including brushes, which is one of the most attractive artists love. In this article you can… Continue reading 35 Best Procreate Brushes For Procreate App
How to Make a Rap Album Cover Art (Using an Album Cover Maker)
If you’re an aspiring rap artist, independent rap label, or an MC spitting lyrics, at some point you’re going to need a cool album cover design to promote your work. The Placeit album cover maker app offers a wide selection of album covers that you can customise in a matter of minutes to create amazing… Continue reading How to Make a Rap Album Cover Art (Using an Album Cover Maker)
How to Self-Host Google Fonts on Your Own Server
As web designers living in the era of high-speed internet, we have picked up the habit of adding external dependencies such as fonts from third-party servers, most frequently from content delivery networks (CDNs). However, this is not always the best decision. Sometimes, it’s still better to stick to your own infrastructure and host your assets… Continue reading How to Self-Host Google Fonts on Your Own Server
17 Tools I Can’t Design Without
I think of a creative practice as a combination of an approach (a design philosophy) and a series of techniques (craft skills); a good tool facilitates a technique, which in turn supports an approach. It wasn’t until I sat down to write a list of tools I can’t design without, that I realized just how… Continue reading 17 Tools I Can’t Design Without
How To Act and Understand Accessibility Right Now
In recent history, the digital channel has extended it’s already dominant reach, even further. Whether its COVID-19, omnichannel strategy, mobile, or driven by user behavior and expectations, the digital channel is key for business-to-consumer (B2C) organizations. As organizations are investing more in digital channels, it’s important that accessibility is included. Not addressing accessibility can leave… Continue reading How To Act and Understand Accessibility Right Now