A UI designer with no tools is like a driver without a steering wheel – it’s funny and dangerous.

Prototyping

First things first – UI designers can’t explain their ideas abstractly, they need to show prototypes. We’re long past lifeless screenshots and sketches – now an alpha version of your interface can be created in minutes, and modern prototyping services allow you to do it. In the end, it’s all a matter of preference.

Let’s go over a few prototyping services here:

InVision – it’s likely you’ve already heard of InVision. They are doing a great job by regularly adding new features and integrations. It’s free and easy to use. The only thing I should mention is that it is a web service and you need to have an internet connection. But really, is that even still a thing?

Figma – A new player on a field of prototyping that aims to take design collaboration to the next level – an excellent service if you want to be on the same page as your colleagues.

Axure – I have to mention Axure here, although strictly speaking it’s not a free tool. It has a 30-day trial, which is kind of like getting a Hadron Collider for 30 days. Axure may not be the simplest of tools (and why should it be?), but it makes up for it through the complexity and fidelity of prototypes you can create. It also has a robust and professional community, and a bunch of tutorials to help you get started.

Marvel – Marvel is a very intuitive tool, yet powerful enough to make it your all-in-one solution. It has a free version, where you are only restricted by number of projects, while still having access to all the features.
÷÷
Mockplus – Mockplus is all about rapid prototyping. Just drag and drop things into the mix and in minutes you’ll have something to test with your users or colleagues. If speed is all you need – give this a try.

Justinmind – Justinmind is another “big-game” tool, which helps you create prototypes of increased complexity. I’d suggest you try both this and Axure for a few days and then make your decision on which tool to use. Because, as they say, the devil is in details.

Inspiration

Great artists steal. Worst artists steal too. The difference between great designers and worst designers is all about how thoughtfully they steal something. Don’t steal a set of buttons, steal a mindset. Steal the logic behind the project. Otherwise, you’ll end up like a kid who brainlessly copied Schwarzenegger’s bodybuilding program – best case scenario someone (not you) will have a good laugh.

Dribbble – A place where thousands of designers show their work. What else do you need? Oh, right. A website where some of their sources can be accessed for free.

Behance – Another social network of designers.or some reason I perceive Behance as more illustration oriented because my favorite illustrators have their portfolios there, but that’s not true at all. It has a lot of interface examples and, given the fact that most designers have portfolios both on Behance and Dribbble, I leave the choice up to you.

CursorUp – Hundreds of super-inspiring website designs, handpicked by Senior Product Designer, Craig Barber.The site is updated daily with fresh new websites to keep you inspired. You can also filter by portfolio, agency, startup and ecommerce so you can find exactly the type of website design inspiration you’re looking for!

Zurb Patterns – Not exactly patterns, but a beautiful showcase of UI elements / whole interfaces.

UpLabs – This website has everything you need. And better yet, it’s all categorized: material, iOS, and website design. It also has a very engaged community. I highly recommend you check it out.

Site Inspire – From seteInspire FAQ: “siteInspire receives over 200 submissions per day so it, unfortunately, it is impossible to feature every site, so we have to limit the number of posts.” Given the fact it showcases 3 websites on average per day, I’d say you get to see the best.

Product Hunt – With plenty of new projects featured daily, Product Hunt easily becomes a source of inspiration. Creators of these projects often available in the comments section and willing to answer questions.

UI Cloud – They say it’s the largest user interface design database in the world. You are welcome to fact check this.

Awwwards – Sort of an Oscar for websites. At least that’s their aim. Classy – at least no one will tell you have a poor taste.

The Best Designs – We’ve already used an Oscar analogy, so this would be Golden Globes. Same thing, different package. No paparazzi, though.

UI Parade – A showcase of UI elements, that you can compose in any order. I’d say they are “trendy”.

Blogs

Smashing Magazine – I know one thing for sure – these guys choose very carefully what content they publish. Sometimes it takes months to approve, but it’s well worth the wait for both authors and readers.

Invision Blog – I’ve already mentioned that InVision does a great job with their service. It’s not surprising that they are doing a great job with their blog as well. I like that many of their articles are based on the first-hand experience, and believe me, they have a lot of experience to share.

UX Planet – Though a primary topic of Nick’s publication is user experience, you’ll find half of the articles devoted to UI, which is not that surprising. It’s 2017 and people still writing articles “What’s the difference between UI and UX?”.

Tubik Studio Blog – I’ve seen many design studios that start blogging and then, after a few weeks, find it tedious and unpleasant and drop it altogether. Not in this case! Tubik’s blog is constantly filled with relevant and insightful articles, showing the inner works of a successful design studio.

Hacking UI – Hacking UI is a community for designers, developers and creative entrepreneurs with a passion. Besides a blog, there is also a newsletter and a podcast.

Resources

Some websites feature everything, while others are focused on a specific type of graphic assets. By no means restrain yourself to only one.

GraphicBurger – 10,000+ graphic assets & ready to use templates.

Pixel Buddha – Fonts, icon sets, website templates for Photoshop and Sketch; UI Kits for the web and mobile apps, textures, seamless patterns, layer effects, and many others.

Material Design UI Kit for Axure RP – Axure widget library for Android mobile, tablet, desktop, and wearables. All components are based on Google’s new Material Design Guidelines and Baseline Grid.

Premium Pixels – Lots of free stuff: mock-ups, PSDs, icons, etc.

Design Wizard – an online graphics editor with over 10,000 free templates for the most popular types of graphics on the web: Social Media templates (Facebook, IG, Twitter, etc.), professional assets (Business Cards, Certificates templates), and even restaurant menus. 1,2 million images in the database and a video library as a bonus.

XDGuru – the biggest collection of free and premium resources for Adobe XD: UI kits, website templates, icons, tutorials and more.

UI Space – PSD, Sketch, fonts, AI and Mockups. If you’re too lazy to search, they have an editor’s choice section.

SketchAppResources – If you’re an avid Sketch user, this is a no-brainer. Kits, icons, tutorials, templates and more.

FigmaCrush – a curated collection of free resources, UI kits and templates for Figma.

Photos

Unsplash – Free quality photos.

StockUp – Free quality photos with a twist: gathered from different quality stocks.

Icons

Icons8 – The biggest icon pack created by a single design team. Thus its main advantage: all icons are made consistent with each other making it easy to combine them in a single interface. Bonus: every icon has iOS, Material Design and Windows versions, if you want to follow major companies guidelines.

Iconfinder – Iconfinder is all about quantity. With 1,5 million icons available you are destined to find something to your taste.

Nounproject – 500,000 high-quality icons. They’ve recently added recoloring feature that is very cool!

Typography

TypeGenius – Find a font combination for your design needs.
1001 Free Fonts – This name is terribly misleading. They have about 30,000 fonts to the date.
Google Fonts – Free fonts optimized for websites.
Bold is a web tool with 400 font combinations. It renders font pairing suggestions in a web page “design mockup.