Happening Studio: Basically Radical, Radically Basic Web Coding

Basically Radical, Radically Basic
Web Coding

Welcome!
Let’s Get Radical.

The Big Ideas

  • Basic is good. Complexity can be Built Within.
  • Sometimes Coding Dictates Your Design.
  • Everything is Liquid, Build a Container to Pour.
  • Deconstruct: Don’t Build from Scratch

Sign up links:

Codepen ➤
Sign up sheet ➤

Helpful Links

DIV Shaper ➤
Color Assets ➤
Type Treatment ➤
Div Dropshadows ➤
W3 (HTML Encyclopedia) ➤
W3 (CSS Encyclopedia) ➤
Transform Angles ➤
CSS Animation Library ➤
Google Fonts ➤

Images

Image Uploader ➤
Giphy ➤
Unsplash ➤

General Workflow

Excercise 1 (1hr): Get to Know HTML & CSS
Excercise 2 (1.5hr): Make a Web Poster

Excercise 1

Intro Presentation ➤
Getting to Know HTML / CSS
Image-making through BG CSS
— Blend mode 2 images (sample) ➤
— Apply Funky Shapes + GIF (sample) ➤

HTML

CSS

Excercise 2

Pick one pen from the list and make a web poster, incorporate one more pen if you like. Your webposter should be curious, dynamic and imaginative. Communicate an urgent message.

Flexible Pens (Easy)

Text Clipping Pen ➤
Blend Mode Pen ➤
CSS Animation Pen ➤
Perspective Pen ➤
Draggable Pen ➤
Draggable — Blend Mode Pen ➤
Draggable — Z Index Pen ➤
Vimeo Background Pen ➤

Stubborn Pens (Difficult)

3D Box Pen ➤
2 Column Seperate Scrolls ➤
Responsive Narrative ➤

instructor:
Masato Nakada

e:
Masato8800(at)gmail.com


Spring 2024


Los Angeels, CA