Community Picks·3yWeb UX: Study Guide
The resources here are grouped under the following topics: General Consideration on Web Usage Viewing Behaviors on the Web Eyetracking Gaze Patterns Web Interaction Design Content. This section introduces fundamental theories and key research on information-seeking behaviors on the web.
builder.io·3yClosing the Gap: Simplify Your Web Layouts with the CSS Gap Property
The CSS Gap Property is a shorthand for the size of the gap between the rows and columns in, or multi-column layouts. Using the gap property instead of margins, you can use the CSS gap property to achieve the same effect with a single line of code. It simplifies layouts, improves readability, enables responsive design, reduces code complexity and improves browser performance.
UX Planet·3y10 AI website builders every UI/UX designer must try
Keep an eye on these top 10 fantastic AI builder platforms I came across. Framer AI One my favourite website builders out there. Dora AI One of the forefront in bringing AI to website building. Kleap Kleap is not only built your website with AI but also helps you choose the right words and pics for you.
UX Planet·3yTop 5 Design Systems That Streamline Design Process
For each design system, we will provide a Figma UI kit so you don’t need to create UI elements from scratch. The HIG is a must-have tool for anyone who wants to build a product for the Apple ecosystem. Microsoft Fluent 2 is the next evolution of Microsoft’s design system.
UX Planet·3yDesign System — Fundamental principles for designing and developing a robust Design System.
A Design System is a large set of reusable components combined with a set of rules, using visual design elements like colors, spacing, or shapes. It enables you to deliver a consistent design in less time. It doesn’t only save your time but it helps in maintaining a consistent experience.
LambdaTest·3yComplete Guide to Color Contrast Accessibility
WebAIM (Web Accessibility in Mind) is a platform that provides guidelines on how accessibility should be adopted across the web. This is where the CSS color-contrast() feature can help developers provide adequately contrasting and accessible modern web designs. We explore color contrast accessibility in CSS, its implementation, and how to test websites or mobile applications.
Hacker Noon·3y12 Project Ideas for Aspiring Web and Mobile Developers
The article emphasizes the importance of focusing on user interface and experience, while the projects serve as valuable learning experiences and portfolio pieces. For mobile developers, suggested projects encompass an ecommerce app, diet tracking app, personal finance app, movie review app, photo editing app, and social networking app.
Codemotion·3yThe Rise of ViteJS: Unraveling its Popularity
ViteJS is fundamentally a build tool and local development server. It is designed to streamline the front-end development of modern web apps by reloading code modules dynamically to avoid recompiling the entire application. Vite is, in part, built on Rollup, but bottlenecks can be a problem for developers with complex code.
UX Planet·3y20 essential Figma plugins every designer must try
Most Figma plugins in this list are available for free. Remove BG allows you to remove the background of images with just a single click. Icons8 provides access to 3,000,000+ icons (consistent, pixel-perfect, in 40+ styles), photos (flat and 3D, vector and raster) and illustrations.
freeCodeCamp·3yHow to Use Un-Styled UI Components – Guide for Front-End Developers
The term "un-styled" doesn't signify a lack of design – rather, it refers to a blank slate that lets you infuse your creativity and branding without the limitations that come with traditional UI elements. Un-Styled UI components give you the freedom to mold every detail to align with your app's design and purpose.
asayer·3yEffective Cross-Browser Testing Strategies
Cross-browser testing involves testing a web application to ensure it functions and appears on different browsers and versions. It involves verifying that websites or web applications work and look the same across different web browsers and their versions. This article explores the best practices and strategies for efficient cross- browser testing.
asayer·3yHacking the Brain: Unleashing the Power of Neuroscience for Web Design
Hacking the Brain: Unleashing the power of the brain to design a web site. This article covers different ways we can leverage the principles of neuroscience to craft remarkable user experiences that will leave our visitors wanting more. The most effective websites are those that engage all brains with all brains.
asayer·3yCreate Stunning Pages with React and Shoelace CSS
Shoelace CSS is a lightweight and modular CSS framework that provides developers with a simple and efficient way to style their web applications while focusing on flexibility. This article will show you all the needed details so you can immediately start using the framework. In this section, we’ll be working with components and elements which are very simple to use.