--- title: Best UX posts — November 2023 | daily.dev description: The most upvoted UX posts from November 2023, curated by the daily.dev community. canonical: https://daily.dev/tags/ux/best-of/2023/11 twitter:card: summary_large_image twitter:site: @dailydotdev og:url: https://daily.dev/tags/ux/best-of/2023/11 og:type: website og:site_name: daily.dev og:title: Best UX posts — November 2023 | daily.dev og:description: The most upvoted UX posts from November 2023, curated by the daily.dev community. og:image: https://media.daily.dev/image/upload/s--VAY5ToZt--/f_auto/v1724209435/public/daily.dev%20-%20open%20graph --- # Best of UX — November 2023 1. 1 [](https://daily.dev/posts/all-about-cookies-and-javascript-6dlmlfpul "All about Cookies and JavaScript") Article asayer · 3y All about Cookies and JavaScript Learn about cookies and how they enhance website user experience. Discover the types of cookies and their attributes. Find out how to work with cookies in JavaScript. 122 4 2. 2 [](https://daily.dev/posts/optimize-web-app-performance-and-loading-speed-lcjyumolo "Optimize Web App Performance and Loading Speed") Article asayer · 3y Optimize Web App Performance and Loading Speed Tips for optimizing web app performance and loading speed are provided. Factors hindering website speed and efficiency are discussed, as well as tools for analyzing website performance. 72 1 3. 3 [](https://daily.dev/posts/design-perfect-date-picker-rcalztesh "Design Perfect Date Picker") Article UX Planet · 3y Design Perfect Date Picker This article provides ten recommendations for designing an excellent date picker. It covers design recommendations for the input field and the calendar widget. 38 4. 4 [](https://daily.dev/posts/cookie-permissions-101-uaitvigys "Cookie Permissions 101") Article Community Picks · 3y Cookie Permissions 101 Companies must give users more control over data privacy by providing options for cookie permissions. Users' behavior towards cookie permissions vary, with some being deniers, skeptics, tech-savvy, impatient, or enthusiasts. Design guidelines for cookie-permission requests include providing user options, avoiding deceptive UI patterns, using plain language, and minimizing the size of cookie overlays. Cookie-permission overlays are not just compliance requirements but an opportunity to build trust and improve user experience. 35 5. 5 [](https://daily.dev/posts/17-figma-design-systems-you-need-to-know-about-u0l5j5ze4 "17 Figma design systems you need to know about") Article LogRocket · 3y 17 Figma design systems you need to know about Design systems are curated collections of properties, components, and templates used to maintain consistency in digital product design. Some popular design systems include those for Apple, Google, Microsoft, Uber, Salesforce, Shopify, Atlassian, and IBM. Premium design systems offer more versatility and frequent updates. Useful Figma plugins and essential shortcuts can enhance design system management and speed up the design process. 32 6. 6 [](https://daily.dev/posts/new-ux-design-and-a-i-tools-that-i-discovered-in-october-2023-c1xxkikca "New UX Design and A.I Tools that I discovered in October 2023") Article UX Planet · 3y New UX Design and A.I Tools that I discovered in October 2023 Discover new UX design and AI tools, including Figma colour wheel, Jony Eye plugin, and Builder.io. 32 7. 7 [](https://daily.dev/posts/a-better-ux-create-url-previews-in-react-99djx1io5 "A better UX: create URL previews in React") Article asayer · 3y A better UX: create URL previews in React URL previews in React can enhance user experience and engagement by providing a glimpse of content before clicking on a link. React-Microlink is a library that simplifies the process of creating URL previews in React applications. It offers customization options such as media type, autoplay, controls, looping, and size. URL previews can be used in various scenarios such as content previews, multimedia feeds, portfolio showcases, entertainment insights, and curated news. To implement React-Microlink, you need to install and import the library, and then use the Microlink component to render URL previews. 28 8. 8 [](https://daily.dev/posts/auto-saving-forms-done-right-2-2-implement-a-good-auto-saving-form-using-react-hooks-i9xzdtmjg "Auto-Saving Forms Done Right 2/2 Implement a good auto-saving form using React Hooks") Article The Miners · 3y Auto-Saving Forms Done Right 2/2 Implement a good auto-saving form using React Hooks Learn how to implement an auto-saving form using React Hooks. The article provides guidelines for designing an auto-saving form and walks you through the implementation process step-by-step. It covers topics such as setting up the API, styling with Bulma, adding form functionality, implementing auto-save and manual save, handling save status and errors, and adding a loading spinner. 22 9. 9 [](https://daily.dev/posts/the-foundations-of-the-frontend-cloud-vercel-wvh1qzkj7 "The foundations of the Frontend Cloud – Vercel") Article Vercel · 3y The foundations of the Frontend Cloud – Vercel The article discusses the importance of the Frontend Cloud and how it can automate the infrastructure for dynamic websites. It explains the benefits of decoupling the frontend from the backend and highlights the role of frontend frameworks in building scalable architectures. It also introduces the concepts of framework-defined infrastructure (FdI) and serverless architecture. 19 10. 10 [](https://daily.dev/posts/how-to-instantly-improve-your-design-using-7-key-gestalt-principles-mvzk86kiq "How to instantly improve your design using 7 key Gestalt Principles") Article UX Planet · 3y How to instantly improve your design using 7 key Gestalt Principles Learn how to improve your design instantly by using the 7 key Gestalt principles, which explain how we see and group objects. By understanding these principles, you can create more intuitive designs, reduce cognitive load, and improve aesthetics. The principles include the Low of Proximity, Low of Similarity, Low of Closure, Low of Continuity, Figure Ground principle, Low of Symmetry & Order, and Low of Common Fate. 17 1 11. 11 [](https://daily.dev/posts/is-technology-harming-our-brains--ueqoglyys "Is technology harming our brains?") Article Medium · 3y Is technology harming our brains? Technology and instant gratification are harming our brains by providing unlimited dopamine, leading to addiction and time spent in the emotional area of the brain. We are also relying on Google for problem-solving, reducing the need for our own memory retention. Excessive screen time during brain development years can increase the risk of Alzheimer's and dementia. To mitigate the harm, delaying gratification and staying mentally active are recommended. 16 4 12. 12 [](https://daily.dev/posts/case-study-designing-a-landing-page-for-tutorly-hyfhr98i5 "Case Study: Designing a landing page for Tutorly") Article Bootcamp · 3y Case Study: Designing a landing page for Tutorly This case study discusses the process of designing a landing page for Tutorly, an Edtech platform that connects students with tutors in real-time. It covers the research, design decisions, and application of the AIDA framework to create an effective landing page. The target audience for the platform is students from classes 6th-12th. The main benefits of the platform include live tutoring, hand-picked tutors, and personalized learning. 16 13. 13 [](https://daily.dev/posts/ai-for-ux-getting-started-dxdc7zxlt "AI for UX: Getting Started") Article Community Picks · 3y AI for UX: Getting Started AI can be used to increase productivity and improve the quality of work in UX. AI tools such as ChatGPT and Midjourney are recommended for UX professionals. Specific UX tasks that AI can help with include generating ideas, creating illustrations, and improving UX writing. It's important to retain human judgment when using AI. 14 14. 14 [](https://daily.dev/posts/neubrutalism-in-web-design-ja1axqrpq "Neubrutalism in web design") Article LogRocket · 3y Neubrutalism in web design Neubrutalism is a design trend in web design that rejects a polished look and focuses on exposing raw materials. It brings back creativity and individuality that was missing in flat design. Neubrutalism features unconventional typography, imperfect aesthetics, bright colors, prominent borders and shadows, asymmetrical layouts, and noisy textures. It allows designers to showcase their creativity but may be inaccessible and overwhelming to users, so a balance between neubrutalism and traditional web design is necessary. 13 15. 15 [](https://daily.dev/posts/uplevel-your-filter-menu-rh8uhwkv2 "Uplevel your filter menu") Article UX Planet · 3y Uplevel your filter menu Learn about strategies for rendering filterable lists, optimizing filter menus for scroll and mobile, and updating filter options as the user interacts. 13 1 16. 16 [](https://daily.dev/posts/how-to-find-generative-ai-use-cases-vcahf1pfs "How to find Generative AI use cases") Article UX Planet · 3y How to find Generative AI use cases The article discusses the process of finding Generative AI use cases, the concept of AI augmentation, and the co-creation mode of operation with AI. 13 17. 17 [](https://daily.dev/posts/i-interviewed-3-designers-hired-0-of-them-here-s-why-tjumy0do5 "I interviewed 3 designers & hired 0 of them — here’s why") Article Medium · 3y I interviewed 3 designers & hired 0 of them — here’s why The article discusses common mistakes made by designers during interviews, including not choosing relevant case studies, not being able to articulate the impact of projects, and not explicitly stating their contributions. It also emphasizes the importance of collaboration and handling challenges. The article provides tips for designers to improve their interview performance. 12 2 18. 18 [](https://daily.dev/posts/the-value-of-design-0tboufxa5 "The Value of Design") Article UX Planet · 3y The Value of Design Design is not just about making things pretty, but about problem-solving and delivering effective solutions. The value of Design can be quantified by establishing KPIs such as adoption, sales volume, and downloads. Design and Engineering are not competing disciplines, but complementary partners in the solutioning process. The effective marriage of all disciplines leads to successful endeavors. 12 19. 19 [](https://daily.dev/posts/client-side-form-validation-with-javascript-44olx8acm "Client-Side Form Validation with JavaScript") Article Community Picks · 3y Client-Side Form Validation with JavaScript This article explores client-side form validation with JavaScript. It discusses the importance of validating user input and provides an example of setting up a form. It also includes a script for form validation using event listeners. The article highlights the benefits of interactive form validations in creating user-friendly web forms. 12 20. 20 [](https://daily.dev/posts/introducing-dream-an-ai-no-code-tool-to-build-fully-functional-web-apps-and-components-with-natura-bzzzcrbas "Introducing Dream – an AI no-code tool to build fully functional web apps and components with natural language") Article Community Picks · 3y Introducing Dream – an AI no-code tool to build fully functional web apps and components with natural language Dream is an AI no-code tool that allows both technical and non-technical individuals to build and deploy fully functional web apps and components using natural language. The tool includes features such as website project creation, page generation, and modular sections. During the residency, improvements were made to the UX, custom integrations, generation output, and prompting style and context management. 11 2 21. 21 [](https://daily.dev/posts/setting-transition-height-in-css-vbkziswji "Setting Transition Height in CSS") Article TestMu AI (Formerly LambdaTest) · 3y Setting Transition Height in CSS Learn how to set transition height in CSS and apply best practices to improve user experience. Avoid abrupt changes in heights by using fit-content value and distribute spaces evenly among flex or grid items. Change the transition height by adjusting the target height property and transition duration. 11 22. 22 [](https://daily.dev/posts/designing-web-design-documentation-smashing-magazine-hikro5nvb "Designing Web Design Documentation — Smashing Magazine") Article Smashing Magazine · 3y Designing Web Design Documentation — Smashing Magazine This article emphasizes the importance and benefits of design documentation in the field of web design. It highlights the need for clear and accessible documentation that reflects the hybrid nature of digital design. The article provides key considerations and resources for creating design documentation and emphasizes the importance of collaboration, use cases, language, and aesthetics. It also advocates for publishing and maintaining design documentation to facilitate knowledge sharing and continuous improvement. 10 23. 23 [](https://daily.dev/posts/how-to-attract-freelance-design-clients-in-2023--cxfipvxu7 "How to Attract Freelance Design Clients in 2023?") Article UX Planet · 3y How to Attract Freelance Design Clients in 2023? LinkedIn has seen significant growth this year, particularly for those embarking on content creation. Arpit Chandak is a Freelance Graphic Designer aiming to offer services to startups for branding needs. For high-quality, well-paying clients, Behance is the go-to. 10 [See all UX archives](/tags/ux/best-of) ```json {"@context":"https://schema.org","@graph":[{"@type":"Organization","@id":"https://daily.dev/#organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180},"sameAs":["https://twitter.com/dailydotdev","https://github.com/dailydotdev","https://www.linkedin.com/company/daily-dev-ltd"]},{"@type":"WebSite","@id":"https://daily.dev/#website","url":"https://daily.dev","name":"daily.dev","publisher":{"@id":"https://daily.dev/#organization"},"potentialAction":{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https://daily.dev/search?q={search_term_string}"},"query-input":"required name=search_term_string"}}]} {"@context":"https://schema.org","@graph":[{"@type":"CollectionPage","@id":"https://daily.dev/tags/ux/best-of/2023/11#page","url":"https://daily.dev/tags/ux/best-of/2023/11","name":"Best UX Posts — November 2023","description":"The most upvoted UX posts from November 2023, curated by the daily.dev community.","isPartOf":{"@type":"WebSite","url":"https://daily.dev"}},{"@type":"ItemList","@id":"https://daily.dev/tags/ux/best-of/2023/11#items","numberOfItems":23,"itemListElement":[{"@type":"ListItem","position":1,"url":"https://daily.dev/posts/all-about-cookies-and-javascript-6dlmlfpul","name":"All about Cookies and JavaScript"},{"@type":"ListItem","position":2,"url":"https://daily.dev/posts/optimize-web-app-performance-and-loading-speed-lcjyumolo","name":"Optimize Web App Performance and Loading Speed"},{"@type":"ListItem","position":3,"url":"https://daily.dev/posts/design-perfect-date-picker-rcalztesh","name":"Design Perfect Date Picker"},{"@type":"ListItem","position":4,"url":"https://daily.dev/posts/cookie-permissions-101-uaitvigys","name":"Cookie Permissions 101"},{"@type":"ListItem","position":5,"url":"https://daily.dev/posts/17-figma-design-systems-you-need-to-know-about-u0l5j5ze4","name":"17 Figma design systems you need to know about"},{"@type":"ListItem","position":6,"url":"https://daily.dev/posts/new-ux-design-and-a-i-tools-that-i-discovered-in-october-2023-c1xxkikca","name":"New UX Design and A.I Tools that I discovered in October 2023"},{"@type":"ListItem","position":7,"url":"https://daily.dev/posts/a-better-ux-create-url-previews-in-react-99djx1io5","name":"A better UX: create URL previews in React"},{"@type":"ListItem","position":8,"url":"https://daily.dev/posts/auto-saving-forms-done-right-2-2-implement-a-good-auto-saving-form-using-react-hooks-i9xzdtmjg","name":"Auto-Saving Forms Done Right 2/2 Implement a good auto-saving form using React Hooks"},{"@type":"ListItem","position":9,"url":"https://daily.dev/posts/the-foundations-of-the-frontend-cloud-vercel-wvh1qzkj7","name":"The foundations of the Frontend Cloud – Vercel"},{"@type":"ListItem","position":10,"url":"https://daily.dev/posts/how-to-instantly-improve-your-design-using-7-key-gestalt-principles-mvzk86kiq","name":"How to instantly improve your design using 7 key Gestalt Principles"},{"@type":"ListItem","position":11,"url":"https://daily.dev/posts/is-technology-harming-our-brains--ueqoglyys","name":"Is technology harming our brains?"},{"@type":"ListItem","position":12,"url":"https://daily.dev/posts/case-study-designing-a-landing-page-for-tutorly-hyfhr98i5","name":"Case Study: Designing a landing page for Tutorly"},{"@type":"ListItem","position":13,"url":"https://daily.dev/posts/ai-for-ux-getting-started-dxdc7zxlt","name":"AI for UX: Getting Started"},{"@type":"ListItem","position":14,"url":"https://daily.dev/posts/neubrutalism-in-web-design-ja1axqrpq","name":"Neubrutalism in web design"},{"@type":"ListItem","position":15,"url":"https://daily.dev/posts/uplevel-your-filter-menu-rh8uhwkv2","name":"Uplevel your filter menu"},{"@type":"ListItem","position":16,"url":"https://daily.dev/posts/how-to-find-generative-ai-use-cases-vcahf1pfs","name":"How to find Generative AI use cases"},{"@type":"ListItem","position":17,"url":"https://daily.dev/posts/i-interviewed-3-designers-hired-0-of-them-here-s-why-tjumy0do5","name":"I interviewed 3 designers & hired 0 of them — here’s why"},{"@type":"ListItem","position":18,"url":"https://daily.dev/posts/the-value-of-design-0tboufxa5","name":"The Value of Design"},{"@type":"ListItem","position":19,"url":"https://daily.dev/posts/client-side-form-validation-with-javascript-44olx8acm","name":"Client-Side Form Validation with JavaScript"},{"@type":"ListItem","position":20,"url":"https://daily.dev/posts/introducing-dream-an-ai-no-code-tool-to-build-fully-functional-web-apps-and-components-with-natura-bzzzcrbas","name":"Introducing Dream – an AI no-code tool to build fully functional web apps and components with natural language"},{"@type":"ListItem","position":21,"url":"https://daily.dev/posts/setting-transition-height-in-css-vbkziswji","name":"Setting Transition Height in CSS"},{"@type":"ListItem","position":22,"url":"https://daily.dev/posts/designing-web-design-documentation-smashing-magazine-hikro5nvb","name":"Designing Web Design Documentation — Smashing Magazine"},{"@type":"ListItem","position":23,"url":"https://daily.dev/posts/how-to-attract-freelance-design-clients-in-2023--cxfipvxu7","name":"How to Attract Freelance Design Clients in 2023?"}]},{"@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://daily.dev"},{"@type":"ListItem","position":2,"name":"Tags","item":"https://daily.dev/tags"},{"@type":"ListItem","position":3,"name":"UX","item":"https://daily.dev/tags/ux"},{"@type":"ListItem","position":4,"name":"Best of","item":"https://daily.dev/tags/ux/best-of"},{"@type":"ListItem","position":5,"name":"November 2023"}]}]} ```