Dewey Mac Lab

PSCIB_13 Museo Site

Lesson Plans

1. Project Goals

SWBAT:

Use the Frame tool to create a placeholder for a layout.
Create and stylize a button for a website.
Use layer groups and artboards.
Optimize design assets for the web.
Record an action to automate a series of steps.
Play an action to affect multiple images.
Save entire layouts and individual assets using Export As.
Design for multiple screen sizes with multiple artboards

2. Restore Default Preferences

Start Photoshop, and then simultaneously hold down

Command+Option+Shift

to restore the default preferences

3. Download Folder

Click HERE to VIEW the Lesson13 Folder
DOWNLOAD the entire folder
The folder will download as a compressed .zip file. Double click on it to decompress it.

4. Rename "13Start.psd" and "13Museo.psd" Files

File Name Example: Museo Site 1 Hooker Martina.psdOriginally named 13Start.psd

File Name Example: Museo Site 2 Hooker Martina.psdOriginally named 13Museo.psd

Skip the book instructions for using Bridge
Navigate to the 13Start.psd inside the Lesson 13 folder and open it in FInder.

New file renaming instructions! This time you will rename the file before you open it!

Control Click (without opening it) on the 13Start.psd file and choose rename from the context menu. Rename it following the example shown left. Do the same for the 13Museo.psd file.

5. Book Instructions: Start on Page 321, Step 1

Open your "Museo Site 1" file and start following steps 321, Step 1

6. Pages 341-347: Name 13Museo.psd "Museo Site 2"

If you haven't already

7. Page 338: Close Other Files if Needed

Step 1 directs you to open Gallery6, Gallery7, and Gallery8 JPEGS.
The actions you recorded on the Gallery5 file will apply to all files you have open so be sure to CLOSE any OTHER FILES that you don't want to apply the recorded actions to!

8. Museo Site 2: Stop After Step 4, Page 342 and Rasterize Layers

Some of the instructions for Museo Site 2 don't work if you're using Photoshop versions newer than 2022. You will need to Rasterize your layers.

Click on "Desktop" in the layers panel to expand the contents of the artboard
Shift click to select the slayers (not artboard)
Control click on the "Logo" text on the Logo layer to open a context menu
Choose "Rasterize Layers" (See screenshot left)
Close the "Desktop" artboard in the layers panel and make sure it's selected. (See right)
Resume following steps in the book; Page 342, Step 5

9. Assets Pages 348 - 350 (Screen Shot)

SCREENSHOT INSTRUCTIONS

AFter you have completed all the steps for making the assets (pages 348 - 350) follow the instructions here to show your work.
With your left hand hold 3 keys: COMMAND, CONTROL, & SHIFT
With your right hand tap the 4 key
Click and drag the cross hair icon around what needs to be in the screenshot. You have just made a copy
Load Photoshop
File > New
Choose the "Clipboard" preset
Edit > Paste
Save it and name it "Assets" followed by your last name and then your first name.

Example: Assets Hooker Martina.psd

10. Submit Your Three Museo Site Files

Reflection & Self Gradiing

Include a Reflection & Self-Grading

Note: This sample is for a different project

Also include a REFLECTION based on the RUBRIC GOALS: What were you SUCCESSFUL at? What did you STRUGGLE with?
Also include what GRADE you think you deserve.

Rubric

05 Points: FILE NAME: The Museo Site 1 file was named correctly

05 Points: FRAMES: The Museo Site 1 Frames are the correct size and were positioned correctly

05 Points: LINKED/EMBEDDED IMAGES: All 9 images were linked or embedded as directed. They were all positioned and scaled neatly.

05 Points: BANDS: The 4 bands for the Gallery 1 - 4 buttons are the correct color and size.

05 Points: TEXT: The text for the Gallery 1 - 4 buttons was formatted correctly. There are no spelling errors.
05 Points: FOLDERS: Folders for the Gallery 1 - 4 buttons were made, named, and each contain the correct layers

05 Points: FX (Gallery 1 - 4): The correct FX were applied to the Gallery 1 - 4 folders

05 Points: NAVIGATION: The Navigation layer was turned on.

15 Points: RECORDING: The correct edits were applied & recorded on the Gallery 5 Jpeg. They were played back on only the Gallery 6-8 files

05 Points: FILE NAME: The Museo Site 2 file was named correctly

05 Points: iPHONE ARTBOARD: The iPhone artboard was Created and sized correctly

10 Points: TRANSFORMING: The iPhone layers were transformed correctly without distorting the proportions

05 Points: POSITIONING: The iPhone layers were positioned neatly and as directed.

15 Points: ASSETS: The assets for the Museo Site 2 file were created as directed. The screenshot was uploaded

05 Points: REFLECTION and SELF-GRADING: Private comment with reflection based on rubric goals and numerical self-grading is included

40 Points: MUSEO SITE 1: The 13Start.psd file was renamed correctly as directed on the website and edited as directed in the book

35 Points: MUSEO SITE 2: The 13Museo.psd file was renamed correctly as directed on the website and edited as directed in the book

20 Points: ASSETS: The assets for the Museo Site 2 file were created as directed. The screenshot was uploaded

05 Points: REFLECTION and SELF-GRADING: Private comment with reflection based on rubric goals and numerical self-grading is included

.

NYC Visual Arts Benchmarks

• Art Making

• Developing Art Literacy

• Making Connections Through Visual Arts

• Community and Cultural Resources

• Exploring Careers and Lifelong Learning

Differentiation / Lesson Extension

...Students with different abilities can seek assistance from teacher, paraprofessional, or another student

...The students who finish early can ask a classmate if they need help or review

NYC VISUAL ARTS BENCHMARKS

• Developing Art Literacy

• Community and Cultural Resources

• Exploring Careers and Lifelong Learning

Report abuse