Edit product

$9

UI Chunks E01 (Pilot): All about Buttons - 74 pages guide + Figma/Sketch Library


30 days to refund. No questions asked.


What is UI Chunks?

UI Chunks is a complete source of UI design knowledge, organized in easy-to-learn chunks which refers to the structure of the top notch design systems. It's full of practical tips and good practices, but it keeps a general nature, not limited to a subjective point of view.

Each of the chunks presents anatomy, classification and usage guidelines with richly illustrated examples and Figma/Sketch files to make the theory proven in practice. It stays pleasing to the eye.


For who?

  • UI/UX Designers — for beginners to build solid foundations from scratch or advanced designers to structure and extend existing, intuitive knowledge about components and design systems
  • Product teams — it could be helpful to work out common understanding when scalable products are to be designed
  • Frontend developers — for those who wants to dive into the designers approach of components building to create the pixel-perfect apps


What problem does it solve?

UI Design knowledge is still very scattered and demands multidisciplinary skills. "The chunking" approach lets you organize it — step by step, with understanding and consciousness. You won't need to study hundreds of Medium articles anymore to find the answer (if you're lucky).

With the UI Chunks you'll be ready to design any UI component to create your very own UI kit or a design system. You will see components through long-standing design practitioners eyes.

Basically, if you want to learn or improve your UI design skills by technical approach the UI Chunks is for you.


E01: Buttons


The very first chunk is available now — All about buttons. No bullshit content.

We explored UI buttons from the ground up. Get this ultimate buttons guide for a coffee price. Boost your design skills in no time. Be ready for the design system era.


What's inside:

  • End-to-end source of UI buttons knowledge to make you understand how to design and use buttons properly.

  • Read about anatomy thru classification, to the button language and usage
  • Learn how to build your very own button library in Figma or Sketch


Ebook Content Table (74 pages - counted in Google Doc):

Intro

1. Button Anatomy

  • Container
  • Content
  • Paddings and Spacings

2. Button classification and hierarchy

  • Types and Variants
  • Style
  • Size

3. States & Behaviors

4. Usage

  • Layout fitting
  • Associated actions
  • Ordering and Grouping
  • Alignment

5. Button language

6. Accessibility

  • Disturbed vision
  • Cognitive issues
  • Manual limitations


You will get:

  • 74 illustrated a4 pages - read about anatomy thru classification, to the button language and usage (Notion)
  • 2 button libraries (Sketch + Figma) - analyze and compare how a professional library is build, learn how to build your very own button library


👉 GET E01 FREE SAMPLE


Authors


We're presenting the result of our professional experience for a coffee price but we believe it's worth it. Put the wind in our sails. Give us a feedback to make UI Design learning better together. And more is about to come... ⛵


Andrew Mialszygrosz (Twitter)

UI/UX designer since 2007. Highly focused on web applications, design systems and design operations. He's crazy about product scalability, usability and workflow processes.

Paul Stomma

Product designer with over 10 years experience. Oriented on cross-functional skills around digital products delivery. Design systems and UX writing enthusiast.


Testimonials


–  Greg Dlubacz (@gregdlubacz), Product designer

"This ebook reads very easily, as it's informative, straightforward and fluently written. Gives you a whole overview of the construction of buttons what helps to create components libraries and design systems. This book is an absolute must have for everyone working on or with design systems, UI designers, products designers and other people involved in the process of creating digital products."


– Patryk Ilnicki (@Patryk_Ilnicki), Senior UI/UX Designer, Tetrisly co-founder

"I've read and learned new things about buttons that help me be a better designer and understand how to use them with the user-centered method. Simple language, many examples, and a real-used focus will provide you with the next level of design."


- Wildan Zulfikar (@wzulfikar)

"Checked the free package and I’m hooked, so I bought the full one. Terrific!

This reminds me “Refactoring UI” book (from Adam Wathan and Steve Schoger). Both complement each other and I can say that I’ll want more of content with your writing style. I like that you talked about a11y, use arrows to explain reading path pattern, and overall the illustrations are very helpful.

Please write more of this!"


- Jakub Jaszkin

"I read the very first episode of UI Chunks series and just wanna let you know that it’s great knowledge, but stays very condensed. I have already worked on design systems and despite my personal experience in this area, in the next one, I’ll definitely use tables, rules and tips from first episode. Additional props for editing everything in Notion ❤️.

I’m waiting for the next chunks!"



You've purchased this product

See it in your library

View in Library
Sorry, this item is not available in your location.
Sold out, please go back and pick another option.

0 ratings

Checkout

UI Chunks E01 (Pilot): All about Buttons - 74 pages guide + Figma/Sketch Library

Enter your info to complete your purchase of E01: Buttons

Card

···· ···· ···· 4242
Test card

05/18

Card

Use a different card?

Card

pp paypal

or pay with

We do not keep any of your sensitive credit card information on file with us unless you ask us to after this purchase is complete.

or pay with

You'll be charged US$9.

Your purchase was successful!

We charged your card and sent you a receipt

    Gumroad Library

    Download from the App Store or text yourself a link to the app

    Good news! Since you already have a Gumroad account, it's also been added to your library.

    Powered by Gumroad