By using Framer X, you will speed up your design process and will be able to better communicate the interaction of your designs to the team and stakeholders. In this tutorial, Martina Pérez will show you how to build prototypes and interactions by making use of the pre-built components in Framer X and the ones available in the Framer Store. It should be useful for web designers having none to very little coding experience, interested in learning more about how to better communicate the interactions in the user interfaces they are building.
Read more…
While building a strong customer culture takes a multi-prong approach, workshops are fun and easy — perfect for jumpstarting a sluggish culture and giving participants the thinking tools necessary to filter decisions through the customer lens. In this article, Claire Mason has documented the process around four types of workshops that you can use to drive customer-centricity in your own companies. The workshops are divided into two categories: “general” and “project-specific”. General refers to workshops that are designed for anyone to participate. Project-specific workshops are best run with a particular, actionable outcome in mind.
Read more…
The web is wonderfully diverse and unpredictable because of wonderfully diverse people shaping it. In this new series of short interviews, we talk to interesting people doing interesting work in our industry and sharing what they’ve learned. Today, Vitaly Friedman talks to Brad Frost, author of the book Atomic Design that introduces a methodology to create and maintain effective design systems.
Read more…
Let’s kick off June with some fresh inspiration! Artists and designers from across the globe once again tickled their creativity to cater for beautiful and unique wallpapers. Available with and without a calendar for the month. All images can be clicked on and lead to the preview of the wallpaper, and you can feature your work in our magazine, too. So if you have an idea for a July wallpaper design, please don’t hesitate to submit it. We’d love to see what you’ll come up with.
Read more…
The user experience from a developer point of view is seriously lacking. We don’t get any helpful warnings when we misspell words, misuse APIs or, well, anything, really! We’ve already seen how we can implement the basic parts of our validation library, and how to add all the nice-to-have features we needed. In this final part of this series, Kristofer Giltvedt Selbekk will focus on improving the user experience for the people that will use our validation library: the developers.
Read more…
Have you noticed that contact forms are disappearing? Have you also noticed that many websites are replacing their forms with chatbots? Whether you put a chatbot on your website or direct visitors to one hosted on Facebook Messenger, is that a better solution for capturing leads and other contact information than with a traditional form? In this article, Suzanne Scacca will explore what is happening to forms on the mobile web and why chatbots may or may not be a suitable replacement for them.
Read more…
A successful design system needs to become part of an organization’s DNA that help your team produce more consistent user experiences, and it also builds bridges between design and development, and help you improve your design process without exposing your orgchart. In this article, Nick Babich will talk about things you can do to set up your organization for long-term success with your design system.
Read more…
The web is wonderfully diverse and unpredictable because of wonderfully diverse people shaping it. In this new series of short interviews, we talk to interesting people doing interesting work in our industry and sharing what they’ve learned. Today, Vitaly Friedman talks to Phil Hawksworth, a front-end engineer who is now focusing on developing strategies for JAMstack technologies to make building for the web simpler, faster, and more secure.
Read more…
CSS Grid Layout is switched on by using display: grid. What this single value property actually means is display: block grid. We get a block level box which is defined as a grid container, with direct children that are grid items and participate in grid layout. Continuing a series on the display property in CSS, this time Rachel Andrew takes a look at what happens when you use grid as a value of display, with added information about how subgrid changes that behavior.
Read more…
In Kristofer’s previous article, he explained how the basic parts of a validation library can be implemented. While the next part will focus on improving the developer experience, today’s article will focus on adding more features to what was created in Part 1. Kristofer will continue implementing the validation library you started implementing in the previous part of this series. These are the features that are going to take us from a simple proof of concept to an actual usable library!
Read more…