DEV Community

Cover image for Day 1 of #100DaysofCode: Learning UI Design Patterns
Kathy Jean-Joseph
Kathy Jean-Joseph

Posted on

Day 1 of #100DaysofCode: Learning UI Design Patterns



If you're new here to the #kathycodes journey, let me start off by saying Welcome! 🎉

This is my first round of #100daysofcode so I'm starting off as a beginner and I'm learning with Skillcrush — Break into Tech course

I'll be documenting my journey in several ways, if you want tidbits find me on twitter at @kathyjeanjoseph to view my to the day updates of my journey.

Visual? I'm on YouTube and view me in action and a less detailed version of my problems, solutions and takeaways.

Today's Topic: Learning UI Design Patterns.


In my SkillCrush course, this particular module is in the Web Design Fundamentals Course.

The focus was particularly on defining UI, Intuitive Design & Design Patterns & Trends.

Main Notes:


  1. User Interface: How your site graphics, layout & text work together to help users find what they need.

  2. Intuitive Design: Designing sites that users can figure out on their own.

  3. Design Patterns: Pre-built solutions to common web design & UI problems that are proven to work look great.

  4. Design Trends: Popular aesthetic styles that define how things look.

Main Takeaways:

Common design patterns —

  1. page/layout based ways to design the things that users will commonly go to a website to click on. i.e. linking logo to homepage, example text in email input box, etc.

Common design trends —

  1. Minimalist Design
  2. Subtle Gradients
  3. Large, bold type etc.

Beyond the course:


Personal resources for viewing and admiring UI: — #uidesign tag

Top comments (1)

banji220 profile image

Happy first day