Experimental UI Design Course

Day 8 of 30

Day 8: Brutalism Deep Dive

Study (15 min): Research brutalist web design principles and philosophy
Practice (15 min): Create a brutalist landing page using only HTML and minimal CSS
Inspiration: Analyze Drudge Report and Adult Swim's experimental microsites

Understanding Web Brutalism

Brutalism in web design embraces roughness, functionality over prettiness, and honest expression of digital materials. Unlike architectural brutalism's concrete, web brutalism celebrates raw HTML, unstyled elements, and purposeful visual harshness. This aesthetic challenges the smooth, polished surfaces dominating contemporary web design.

Philosophical Foundations

Study the philosophical underpinnings: brutalism values authenticity over refinement, function over form, and direct communication over elegant presentation. Sites like Drudge Report strip away visual polish to focus purely on information delivery. Adult Swim's microsites use deliberately crude aesthetics to match their irreverent content. The "ugly" becomes beautiful when it serves honest expression.

Today's Exercise

Your landing page should embody these principles fearlessly. Use system fonts, minimal CSS, stark black-and-white contrast, and embrace the browser's default styling. Let HTML structure be visible - maybe expose navigation as a simple bulleted list, or use default button styling. Add one bold accent color sparingly. The content could be personal - your design philosophy, a project description, or manifesto. Focus on making every element serve clear communication rather than visual pleasure.

Key Brutalist Elements:

What You'll Learn

This exercise teaches you that aesthetic beauty isn't always about visual refinement - sometimes raw honesty creates more powerful emotional impact. You'll discover how stripping away decoration can actually enhance communication and create memorable experiences through deliberate roughness.

Key Takeaways