111 amazing resources you're gonna love πŸ’–
Savio Martin ・ Mar 11th, 2021 ・ Views

111 amazing resources you're gonna love πŸ’–

Hello Devs πŸ‘‹

This is Savio here. I'm young dev with an intention to enhance as a successful web developer. I love building web apps with React. I have proved my superiority in frontend technologies.

Today, I'm gonna share 100+ super amazing resources every developer are gonna love for sure πŸ’– I hope you'll enjoy this article.

3 UX/UI Design Systems to gain inspiration

3 tools every UX/UI designer should know

3D websites that will inspire every UX/UI designer ⁣

  • 🍻 Protopie.com - go the extra mile with 3D video and awesome animations on scroll

  • ♻️ Pitch.com - began the 3D movement and their characters are super friendly and feature in their website and product. ⁣

  • πŸ’― kukla-kit.com - is a 3D library for Figma projects

3 chrome extensions for every UX/UI Designer ⁣

  • ⌨️ Font Ninja lets you inspect and bookmark fonts and any webpage⁣

  • πŸ’» Go Full Page takes full page screenshots of any webpage ⁣

  • πŸ”₯ Loom lets you record videos directly in chrome

3 Illustration Libraries for UX/UI Designers ⁣

  • 🌈 Absurd.Design have expressive illustrations for products with personality ⁣

  • πŸ₯° Blush.design have a great mix of characters from artists around the world ⁣

  • 🌟 Ouch! - have a comprehensive library of searchable illustrations

3 Typography tools for UX/UI Designers ⁣

  • 🍭 Fontjoy.com generates font pairings with a contrast slider in a single click ⁣

  • 🍟 app.typeanything.io let’s you experiment with font pairings, sizes, spacing, and weights live i. The browser ⁣

  • 🎨 Font Base is a free font manager with access to Google’s fonts for Mac and windows

3 color tools for UX/UI Designers ⁣

  • 🎹 picular.co generates colors based on keywords ⁣

  • πŸš† Coolhue is a gradient plugin for Figma & Sketch ⁣

  • πŸš€ Eva uses AI to generate feedback colors based off your brand color

4 user testing tools for UX/UI Designers ⁣

  • πŸŽ‰ Maze.design is great for running unmoderated tests as it integrates smoothly with your existing prototyping workflow ⁣

  • ✨ Lookback.io is super for moderated usability tests of your product live with users ⁣

  • πŸ€™ Usertesting.com is an accessible tool for your whole team to test with

  • πŸ”₯ UX Tweak - The only UX research platform you need

3 3D libraries for UX/UI Designers ⁣

  • πŸ€ Shapefest.com is a massive library of 3D shapes ⁣

  • πŸ“Ž Storytale.com has a great mix of 3D characters and objects ⁣

  • πŸ₯³ Toy Faces is a super fun 3D avatar library

3 Prototyping tools for UX/UI Designers ⁣⁣

  • πŸ’« Figma lets you effortlessly create prototypes whilst you design ⁣

  • 🍿 Framer has an extensive library of notions and tutorials to help you learn how to prototype ⁣

  • 🀯 Protopie helps you create mind blowing prototypes with native elements

3 sites to gain inspiration as a UX/UI Designer ⁣

  • πŸ“± mobbin.design is a hand picked collection of the latest mobile design patterns ⁣

  • πŸ’Ό Land-Book.com is a great place for landing page and portfolio inspiration ⁣

  • πŸ€ Dribbble is perfect for conceptual thinking and experimental design

3 productivity tools for UX/UI Designers ⁣

  • πŸƒβ€β™‚οΈ Notion is perfect for organising your weekly tasks and design team wiki ⁣

  • πŸ… Tomato 2 is a super app for following the pomodoro technique and managing your time ⁣

  • πŸ“… Calendly helps your organise meetings without the back and forth emailing.

3 accessibility tools for UX/UI Designers ⁣

  • 🎨 colorable.jxnblk.com - Colorable is a great tools for generating an accessible color palette ⁣

  • πŸ’― getstark.co - Stark is a super Figma, XD, Sketch plug-in for running contrast and color blind tests live in your designs ⁣

  • 🌊 Wave is a wicked chrome extension for running an accessibility evaluation live on your site.

3 free image libraries for UX/UI Designers ⁣

  • πŸŽ₯ pexels.com - Pexels is a super resource for free images and videos ⁣

  • 🌍 unsplash.com - Unsplash has powerful search, filters and collections from around the world ⁣

  • ✌️ Reshot.com - Reshot is another super image resource with handpicked, non-sticky images.

3 font resources for UX/UI Designers ⁣

  • ⚑️ Google fonts has over 1k searchable fonts categorised by type. ⁣

  • πŸ“¦ Open Foundry is a super resource for handpicked open-source typefaces ⁣

  • 🐺 Typewolf is super for learning about fonts and font pairings.

3 portfolio tools for UX/UI Designers ⁣

  • ⚑️ Super.so is quick and easy way to convert your Notion docs into an online portfolio ⁣

  • πŸ–₯ Webflow.com lets you design your portfolio directly in the browser across multiple devices ⁣

  • πŸ–Š Grammarly.com fixes your grammar errors helping you write better case studies

3 no-code tools for UX/UI Designers ⁣

  • ⚑️ Webflow is the best no-code website builder with awesome interactions ⁣

  • 🍬 Bubble is a great tool for building web apps without code ⁣

  • πŸ’΅ MemberStack is a no-code membership tool for any website

3 UX Writing resources for UX/UI designers⁣

  • ✍️ dailyuxwriting.com have super how to guides to up your writing game⁣

  • πŸ€™ Uxlibrary.org define the value of UX Writing with super ux writing blog links ⁣

  • πŸ“– uxplanet.org is an awesome handbook for UX writers⁣

3 Figma plugins for UX/UI Designers ⁣

  • β†ͺ️ Autoflow allows you to neatly draw the flows between your frames ⁣

  • πŸ‘€ Color-Palettes font picker lets you view typefaces before you select them ⁣

  • πŸ“Έ Unsplash is super for adding awesome stock images to your designs

3 color gradient tools for UX/UI Designers ⁣

  • πŸ‘€ webgradients.com have 180 awesome gradients with full screen preview ⁣

  • πŸ’ͺ coolors.co have a super gradient maker with a neat toggle between radial and linear ⁣

  • ⚑️ uigradients.com is a super resource to grab limitless gradients with a neat full screen toggle

3 user flow libraries for UX/UI Designers ⁣

  • πŸ“± uxarchive.com have a super library of user flows from top mobile apps ⁣

  • ⚑️ Mobbin.design is the largest user flow library that you can click through on a device ⁣

  • 🍿 pageflows.com is an awesome user flow library with web and mobile apps

3 icon libraries for UX/UI Designers ⁣

  • πŸ’‘ Ikonate.com is a super library of customisable icons that you can preview in dark mode ⁣

  • ⚑️ Useanimations.com is an awesome library of animated icons ⁣

  • πŸ‘€ Streamline.to is an icon app and plugin with over 30k icons to use

3 AI powered tools for UX/UI Designers ⁣

  • 🎨 Khroma.co is an AI powered color palette generator based on your fave colors ⁣

  • ✏️ UIzard.io is an AI tool that converts your sketches into mockups ⁣

  • πŸ“Έ remove.bg is an AI tool that removes any background from an image

3 color palette tools for UX/UI Designers ⁣

  • 😁 happyhues.co is a color palette tool that lets you view curated colors in context ⁣

  • 🌈 colorinspo.com let’s you generate a color palette based on color theory ⁣

  • ⚑️ Colors.muz.li is a color palette generator with a live UI kit demo

3 Zoom alternatives for UX/UI Designers ⁣

  • πŸ‡³πŸ‡΄ Whereby.com is a no fluff video meeting tool made by a secure friendly team in Norway⁣

  • πŸ’­ Vowel.com is a video conference tool that helps you host, plan and transcribe meetings ⁣

  • πŸ“ˆ Macro.io is an interface tool for Zoom that allows you to visualise meeting discussions

3 white boarding tools for UX/UI Designers ⁣

  • πŸ•Ή Freehand by Invision is a quick and easy to use whiteboarding tool⁣

  • ⚑️ Miro is a super tool with loads of handy templates to kickstart your white boarding sesh ⁣

  • 🎨 Mural is a great white boarding tool to use with your team ⁣

3 grid extensions for UX/UI Designers ⁣

  • πŸ“ Page Ruler is super for defining the spacing between components ⁣

  • 🎾 Baseliner is a super grid extension for applying a baseline to your design ⁣

  • 🎹 Grid Overlay is a great for applying a grid system directly to any page

3 awesome AI tools for UX/UI Designers ⁣

  • 🎨 tailwind.ink is an awesome AI color shade generator ⁣

  • πŸ”₯ visualeyes.design is a AI heatmap generator for your designs ⁣

  • βœ‚οΈ Clipdrop is a super AR copy paste tool for adding images, objects, and text to your design ⁣

3 massive Design Systems to inspire UX/UI Designers ⁣

  • βœ… Atlassian.design have a mammoth design systems with neat accessibility checks ⁣

  • πŸ‘€ buffer have a huge design systems with super guidelines on each component ⁣

  • πŸŒ” IBM whopping carbon design system works across a light and dark theme

3 super fun typography tools for UX/UI Designers ⁣

  • πŸ’» wordmark is a super tool that previews every font on your computer ⁣

  • πŸŽ‰ Prototypo is a super tool for creating your own font⁣

  • πŸ’― kerntype is a game that helps you learn how to learn type

3 device mockup generators for UX/UI Designers ⁣

  • πŸ’» previewed.app is a super 2D and 3D device mockup generator across devices ⁣

  • 🀯 threed.io is an awesome 3D mockup generator directly in the browser ⁣

  • ⚑️ Rotato is a super animated mockup generator

3 animated icon libraries for UX/UI Designers ⁣

3 super analytics tools for UX/UI Designers ⁣

  • πŸ‘ useFathom.com is a super simple and visual analytics tool for your product ⁣

  • 🀩 Plausible.io is another awesome analytics tool with a neat UI ⁣

  • ⚑️ Useberry.com is great for grabbing analytics directly on your prototype

3 super productivity tools for UX/UI Designers ⁣

  • 🏑 meetsidekick.com is a super browser that gives your apps a home and removes the need for cluttered tabs ⁣

  • βœ… getslash.co is an awesome tool that helps you complete your to do list ⁣

  • πŸ“§ hey.com is a super tool that makes emails fun and easy to manage

3 character illustration libraries for UX/UI Designers ⁣

  • πŸ‘– Humaaans is an awesome illustration library of characters that you can mix and match ⁣

  • πŸ” control.rocks is a super illustration library with loads of characters and scenes ⁣

  • πŸ‰ struct.rocks is a super fun character illustration library based on shapes

3 agency websites to inspire UX/UI Designers ⁣

  • 🦡🏼 Toyfight.co use humour to demo the value of a small team ⁣

  • πŸ»β€ Hellomonday.com use playful characters to showcase the diversity of their agency ⁣

  • πŸ§‘β€πŸš€ majortom.com use animation on scroll to showcase their iterative

3 must read books for UI/UX Designers

πŸ‘€ Wrapping Up

Yeah, that's a wrap. Hope you enjoyed these amazing resources and you're satisfied with this article. Do not hesitate to share your feedback. I am on twitter @saviomartin7. Give a follow!

Do you know more? Add them in the comments?

🌎 Lets connect

Comments (0)