Topic

User Interface

Articles

Try our Keystroke Figma template

Introducing KEYSTROKE ⌨! My first Figma community template to create keycap quickly (with auto-layout support!). Quickly create keyboard…

Lets talk about Safari & Firefox design revamp

Brand new Safari and Firefox were both announced this month. Both versions received major design iterations. Which do you prefer? Announced…

Figma Best Practices

Figma Best Practice introduces the best industry practice created by Figma team.

Apps

Grid Guide

Tool

Grid Guide

Grid calculator for your Figma. Set Max Width and Columns will return the suitable guter and column width.

Dimmy Club

Tool

Dimmy Club

Free device mockup generator

Get Waves

Tool

Get Waves

Waves have become a popular choice for website page background. Generate svg waves easily with customisable shape, steps and color with getwaves.io

Can't Unsee

Game

Can't Unsee

Can’t Unsee presents two very similar mockups. One is pixel perfect and one is not. While some design principles are very standard (like spacing, line height and visual cues) , some may not agree with all the "correct" design decisions. Built by Alex Kotliarsky.

Blobmaker

Tool

Blobmaker

Blobmaker help you to create random blobs in SVG to catch with design trend.

Pttrns

Pttrns

Pttrns is a great place to kickstart your UI research. Similar user interface patterns and functions are posted across different apps.

Refactoring UI

Refactoring UI

Refactoring UI started as design tidbits to work smoothly with developer. It stresses on visual hierarchy and systematic approach to UI design from a developer point of view. Brand new ebook and resources are available for $149.

Figma

App

Figma

Combining UI design, prototyping, and feedback in one web-based tool, Figma is more than a design app. Users can iterate prototypes in collaboration, and provide feedbacks simultaneously. It is catching up with Sketch for the need in large-scale design projects. Figma is free to try with limited projects with paid upgrade per user.

Unsplasher

Unsplasher

Free sketch plug-in that auto import free licensed photo from Unsplash to your sketch project.

Apple Human Interface Guidelines — Color

Apple Human Interface Guidelines — Color

Color section of Apple’s Human Interface Guidelines is a great introductory piece for color design when you are designing websites and apps.

Magic Mirror

Magic Mirror

Perspective mockups could be created without leaving Sketch app. Magic Mirror adds the functionality of perspective transformation to Sketch artboards. So users can create high-fidelity mockups in perspective. Paid monthly subscription support up to 4x image quality and symbols.

Design + Code

Design + Code

Interactive e-book to teach how to design and code a React app for iOS 11. Written by Ming To.

Snazzy Maps

Snazzy Maps

Customized Google Map style apply on your website.

test

test

test