Booklet

author

Fullstack HQ

Development

7 Design Hacks for Graphic Designers and Developers Part 2 of 2

7 Design Hacks for Graphic Designers & Developers

5. Don't blow up icons that are meant to be small
Icons that were drawn at 16—24px are never going to look very professional when you blow them up to 3x or 4x their intended size. They lack detail, and always feel disproportionately 'chunky'.

6. Use accent borders to add color to a bland design
If you're not a graphic designer, how do you add that dash of visual flair to your Ul that other designs get from beautiful photography or colorful illustrations?

Example 2: Along the side of an alert message.
Example 3:..or to highlight active navigation items.

7. Not every button needs a background color.Is this a positive action? Make the button green. Does this delete data? Make the button red.

Frameworks like Bootstrap sort of encourage this by giving you a menu of semantic styles to choose from whenever you're adding a new button.
1. Primary actions should be obvious. Solid, high contrast background colors work great here.
2. Secondary actions should be clear but not prominent-Outline styles or lower contrast background colors are great options.
3. Tertiary actions should be discoverable but unobtrusiveStyIing these actions like links is usually the best approach.

If the destructive action isn't the primary action on the page, it might be better to give it a secondary or tertiary button treatment.

More booklets by Fullstack HQ

More Development booklets

Your recently viewed booklets

  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
See all booklets