Why UI designers should understand Flexbox and CSS Grid

CSS for UI Designer Or bye bye, 12-column grid layout Most designers are familiar with responsive design, a column-based layout approach with fixed breakpoints to cover all screen sizes. However, we can move beyond the rigid structure with modern CSS layouts, crafting flexible and dynamic designs that seamlessly adjust to different screen sizes. Designers and developers having different… Continue reading Why UI designers should understand Flexbox and CSS Grid

Risk tolerance: why some countries prefer more complex UIs

An analysis of Uncertainty Avoidance and Amazon’s website in various countries Photo by Nathan Dumlao on Unsplash What do Switzerland, the US, Sweden, the UK, and the Netherlands have in common? They are all rich, protestant, relatively cold countries where a big part of the population consists of (former) immigrants. They also form the top 5 of… Continue reading Risk tolerance: why some countries prefer more complex UIs

Prototyping for Apple Vision Pro, baseline alignment in Figma, spatial computing

Weekly curated resources for designers — thinkers and makers. Google Glass emerged as a highly anticipated innovation with the potential to revolutionize our daily lives. Its sleek design, hands-free interface, and augmented reality (AR) capabilities promised a futuristic experience. However, despite its initial hype and grand vision, Google Glass ultimately failed to capture the consumer market and find… Continue reading Prototyping for Apple Vision Pro, baseline alignment in Figma, spatial computing

Where is UI design headed?

Reflections and forecasts amidst the rise of AI and XR. Vrinda Singh · Follow Published in UX Collective · 16 min read · 3 days ago — Listen Share Video courtesy: Keiichi Matsuda I had my first encounter with generative AI in 2016, with the Deep Dream Generator created by Alexander Mordvintsev. It’s an image… Continue reading Where is UI design headed?

Published
Categorized as UX Tagged

15 Best New Fonts, May 2023

Every month we put together this roundup of the best new fonts we’ve found online in the previous four weeks. Enjoy! Publish Serif The Publish family consists of Publish Gothic, Public Sans, and Publish Serif. It was originally designed for the short-lived Danish newspaper ​“Dagen” and is now available publicly. It’s a versatile set of fonts… Continue reading 15 Best New Fonts, May 2023

Removing the Background from an Image in Figma

For many years, Photoshop was the go-to tool for many image editing tasks such as removing the background from an image. But nowadays there are powerful new options for image editing. We can do a lot more with UI design tools like Figma now, including removing an image’s background. In this quick tip, we’ll show… Continue reading Removing the Background from an Image in Figma

Make Smooth Transitions with Easing in Figma and After Effects

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

Designing UI for the Voice Era

The world of web design is incredibly dynamic. Every year, new trends and opportunities emerge, primarily driven by the arrival of modern technology.  In recent years, we’ve seen various updates to the web design landscape, such as the arrival of AR and VR solutions for making mixed media. Video content has increased in quality, while… Continue reading Designing UI for the Voice Era

A to Z of Sketch: Tips & Tricks!

Let me show you some rapid tips and tricks in Sketch for Mac. We’ll look at 26 Sketch tips and tricks from A to Z. Once you get familiarized with Sketch, check out Envato Elements! With one subscription, you’ll have unlimited access to numerous Sketch resources such as Sketch templates, Sketch shapes, and more. One… Continue reading A to Z of Sketch: Tips & Tricks!

What Is Glassmorphism? (With Examples)

May 31, 2021 by Sangalang Kristine Leave a Comment Glassmorphism, shape design, retrofuturistic – these are just a few of the trendy design concepts of 2021. Design trends are getting cleverer and more intuitive in the recent years. Web designers have been developing hundreds of new ways to create impressive aesthetics. These design aesthetics are… Continue reading What Is Glassmorphism? (With Examples)

UX Design Doesn’t End With Your Website

User experience design is something that most of us associate with websites. But why isn’t it something we extend beyond the website? Here’s why I ask this: As a consumer, it’s so rare that your only interaction with a brand is through its website. Take an ecommerce site, for example. You buy a product from… Continue reading UX Design Doesn’t End With Your Website

6 Must-See Web Development YouTube Videos

April 28, 2021 by Sangalang Kristine There is something new to learn, every day. There are so many hacks, tips, and tricks you might not know about. Online tutorials are the best way to learn new things – without cost and can be taken at pace. Hundreds, if not thousands, of web development YouTube videos, are… Continue reading 6 Must-See Web Development YouTube Videos

HTML5 Form Validation With the “pattern” Attribute

In this tutorial we’ll explore HTML’s pattern attribute, using it to help us customize the way we validate our forms. Form Validation Video Check out the video tutorial below, subscribe to Tuts+ on Youtube, or read on to learn more about HTML form validation and the pattern attribute! HTML5 Form Validation Form validation is of… Continue reading HTML5 Form Validation With the “pattern” Attribute

The Future of UI Design for Embedded Systems

The expectations for embedded GUI designs are higher than ever. While the launch of any new embedded device makes the public and developers excited to see if it actually delivers a great UX but simple designs are still prominent in smart fridges, cars, and ovens, etc. Despite the growing need for smartphone-like devices, not all… Continue reading The Future of UI Design for Embedded Systems

Applying white space in UI design

[unable to retrieve full-text content] 8 practical tips, with examples. Good UI design is the thoughtful application of whitespace at all scales of an interface, from component to page, micro to macro. When whitespace is used well, the result is an interface that is harmonious, legible, and, above all, effective and easy to use. 1 /… Continue reading Applying white space in UI design

Mono Icons: 136+ free SVG icons for UI design

The main problem when designing user interfaces is finding a complete and consistent icon set. Here is where Mono Icons comes in handy! It’s an open-source repository including 136+ SVG free icons for UI design. Mono Icons are designed on a grid of 24px × 24px and the icon’s boundary box also contains a 2px… Continue reading Mono Icons: 136+ free SVG icons for UI design

20 Free Vintage Fonts for Graphic Designers

Clean and rough Vintage fonts free download.  Vintage free fonts are best for create vintage logotypes, badges, labels, apparel design, lettering  typography, posters and packaging designs. Vintage fonts are comes with upper and lowercase characters, large set of punctuation glyphs and numerals. In this collection mostly fonts are handcrafted, bold, elegant style with retro / vintage effect. You… Continue reading 20 Free Vintage Fonts for Graphic Designers

6 Figma Plugins to Give You Design Superpowers (and How to Use Them)

Figma plugins are a recent addition to what’s becoming the go-to collaborative tool for UI designers everywhere. Plugins are built by the community (you can even build one yourself if you wish) and provide an easy way to extend your capabilities with Figma. Through this helpful update, designers can automate repetitive tasks, add accessibility features,… Continue reading 6 Figma Plugins to Give You Design Superpowers (and How to Use Them)

50+ Best Free Brush Fonts for Designers

50+ Free brush fonts are here. Unique hand printed and handwritten brush fonts perfect to use for prints, logos, signatures, quotes, badges, labels, packaging design, blog headlines or simply use it to add a fancy text on a photo. All are free and available for commercial use. In this font collection you will enjoy the handpicked… Continue reading 50+ Best Free Brush Fonts for Designers

Differences Between UI Designer and UX Designer: What Does Each One Do?

For many people who don’t know much about the tech world, understanding what UI designers and UX designers do is a bit challenging. From early times, designers were known to be in the clothing and furniture industry. But the industry has grown over time to many more areas including tech. The evolution of technology as… Continue reading Differences Between UI Designer and UX Designer: What Does Each One Do?

10 Important UX Design Tips for UX Designer

One of the most crucial steps in web and app development is designing the user interface. No matter how rich and awesome your application is, if the interface is not user-friendly, the users won’t take too long to remove the application or stop using it. In general, the UI/UX designing is one of the leading… Continue reading 10 Important UX Design Tips for UX Designer

Take Control of Your Projects with these Design Collaboration Tools

Posted · Category: Best Collections You might be building a website for your own needs and doing all the work yourself. In this case, you may think there’s no need for a collaboration tool to smooth out your workflow. Still, having one or more extra pairs of eyes looking over your work can be beneficial.… Continue reading Take Control of Your Projects with these Design Collaboration Tools