Estée Lauder Zen Garden Lab

Back to Projects

Estée Lauder is looking to YOU to design and build a piece featuring Karlie Kloss. Here are the parameters:

• Start with the CSS Zen Garden starter kit. What is a CSS Zen Garden? It’s a demonstration of what can be accomplished with CSS. You will be given HTML to use, and cannot change it at all. The exceptions to that rule are, you can add classes or IDs to elements and you can change the src attribute for video and img tags! Then, you’ll write CSS to make the page your own. Find the CSS Zen Garden project that inspired the challenge in this hack here! The magical thing about Zen Gardens is that everyone will start with the exact same CSS, but end with a totally different outcome!
• Decide on a color palette. Here are a few great resources:
  • Color Hunt
  • Coolers
  • Color Picker
• Decide on which photo assets you will use from the options provided here. This video will walk you through how to use the assets folder in your Glitch project.
• Think carefully about the design decisions you make. You’ll be asked to share your rationale for those decision by reflecting on some questions in the submission form.

Not only will this give you great practice as you continue to develop your skills with HTML & CSS, your work may be featured on Estée Lauders blog! Details on submissions are below.

Set Up

Remix the Zen Garden Starter Kit.

Submission

Here’s how it will work:

• Submit your Glitch project links and responses to a few questions about your inspiration and process using this Google Form.
• Submission deadline: Wednesday evening your second week of camp at 8pm local time

Karlie and the Estée Lauder team can’t wait to see what you submit!

Back to Projects