In preparation for this lesson's assignment, students will create a mood board and color palette for their narrative website.

Objectives:

  • Conduct research into styles and layouts of real-world design.
  • Synthesize varied elements into a new composition.
  • Compose a flexible color palette that contributes to a specific mood or style.

Color Palette

Use one of the following tools to create a color palette for your website. The palette should include five colors. Try to choose colors that can be combined in various ways and still look good together.

  • Adobe Color — A color picker that integrates with the Adobe Suite. Save palettes to your library to use them in Adobe apps.
  • Coolor — A simple color picker that randomly generates color palettes. I like the big, simple interface.
  • Color Mind — Another app that generates color palettes, this one uses a machine-learning algorithm that analyzes thousands of real-world websites. But does it do a better job than a human designer? Also provides a handy preview of the color palette in use on a generic web layout.
  • Palettetron — A color picker with a real nitty-gritty interface, mostly based around a single starting color.
  • Palette Generator — Generates palette based on image uploads.

Take a screenshot of your finished color palette _OR _use the color-codes to create your own image in Illustrator displaying the five colors as squares or other simple shapes.

Mood Board

Collect a series of images that conveys the mood and style of your narrative website idea. Include a variety of images, such as textures, typography, menus, layouts, photographs, illustrations, graphic elements, etc.

Use any of the following tools:

  • Screenshots— Especially with websites, you may just end up taking screenshots of sites that you like. Just be sure to organize you images in a single folder. You can also use screenshot in some of the tools below.
  • Pinterest — A great resource for design inspiration, create an account and save images into specific boards for each project. Try searching for colors, shapes, textures, etc.
  • Matboard — Save images from the web and search existing collections for inspiration.
  • Go Moodboard — Online mood board tool
  • Tumblr — Ostensible a public way to collect images, but lots of unique stuff here as far as art and technology
  • Evernote — this is a guide on using the popular note-taking app to create a mood board.

Take a screenshot of your finished mood board OR save the images yo your computer and arrange them in an Illustrator document.

Submission

Submit images of your color palette and mood board to Open Studio.

You could also use Illustrator to create a single image containing both your color palette and mood board images. If you create a document in Illustrator, export it as a PNG or JPEG that is at least 1920px x 1080px.

[INSERT SUBMISSION LINK]

results matching ""

    No results matching ""