Category Archives: GT20G S1 2023

Design Challenge: Album Art

As explained, you will be designing album art for Leaf Rapids. The album will be called Night Shift.

You can find out more about the band here: leafrapids.org

See/hear the band: youtube.com/@leafrapidsmusic

Dimensions:
12 inches by 12 inches
(300 pixels/inch)

Title track:

Lyrics:
I wake the birds
I send them off into that day
Make sure the sun’s up
Making the rounds in any way
After the nightshift
I turn the stars off one by one

I leave the moon
She’s a wily satellite
Love in the darkness
Sneaking out into the light
Even the nightshift
Is bound to catch a glimpse of sun

Wednesday morning will always be
Tuesday night to me

My quiet industry
In the hours that memories keep
The fox and owl agree
The darkest hours are not for sleep
Here on the night shift
We tuck the days in one by one

Wednesday morning will always be
Tuesday night to me

GT20 Portfolio

I want you to have something to show for all of your hard work and creativity this semester, so I’d like you to put together a portfolio of your best work.

I will guide you and show you a great way to do this, but if you prefer to take the information and display it another way (create a website, put together a video, or some other creative use of your talents), that’s fine too. This should be the kind of thing you could take with you to a job interview to dazzle someone with your skills, or prove to your parents that you’ve learned and created a lot this semester.

Your job in your portfolio is to display a range of projects that you’ve created and explain the skills that you’ve gained along the way. You should be demonstrating work completed in Illustrator, InDesign, and Photoshop.

 

Using InDesign, you’ll put together a multi-page document that combines your best work from the course and describe some of the things you’ve learned and created along the way.

Using Adobe InDesign software create a MINIMUM eight-page portfolio of your best work completed in Graphic Tech. This portfolio will serve as the final exam for this course and should provide you with something useful to document your time here up to now.

All previous projects should be PLACED in this document so you have an editable copy of those files along with the portfolio. The finished portfolio must be properly packaged without any missing links and handed in electronically. You can even publish electronically when done and you may have a printed copy, if you wish.

Your portfolio must include:

  1. An opening page: Title, image (either a photo of you or one of your best pieces of work), your full first and last name, section (class), and graphic design elements that make the page aesthetically pleasing. (Use contrast, high quality, appealing elements, effective colour choices, etc.)
  2. AT LEAST one Photoshop project that you completed. (Acronym Banner, Trading Card, Sign, etc.)
  3. AT LEAST one Illustrator project that you created. (Mandala, artwork, vinyl cutting, original sticker design, logo design, etc.)
  4. AT LEAST one InDesign project that you completed. (postcard, poster, menu, etc.)
  5. AT LEAST one other project of your choice. (independent learning project, personal project that you completed, or just another one of the above projects)
  6. A final summation of what you learned, accomplished, or gained from the course.

EACH PAGE will contain enough information to explain the project/process/software to someone who did not take the course. Your parents, relatives, friends not in the course, or a prospective employer should be able to look at your project and understand the following things:

  • What was the goal/objective/assignment? What were you supposed to learn/include/accomplish?
  • What was your personal goal – how did you figure out what you were going to create/do/accomplish? Was your goal to make something classy, interesting, silly, serious, weird, etc.?
  • What steps were involved in completing the task?
  • What did you have to learn in order to complete the task?
  • What did you struggle with along the way?
  • How do you feel about your work in hindsight?
  • What would you do differently if you had to do this project again?

Make this as informative, interesting, and appealing as you can. This will show that you learned and accomplished something in this course and will demonstrate some of the skills that you should have picked up along the way. You will get a good mark if you do a good job, and you should be able to bring this portfolio to a job interview to show what a creative and intelligent person you are!

I would recommend setting this up to be Letter size. You can decide whether to add a bleed and cut it out or just accept a bit of a white border:

 

CRAP Magazine

Congratulations, you’ve just been named the publisher of your very own magazine! You’ll put together the first issue featuring whatever topic and content you like. Along the way, you’ll demonstrate your knowledge of all 4 of the design principles, Contrast, Repetition, Alignment, and Proximity. Watch the full video below to review and find out about the last two:

This time, use all four principles and in your reflection afterward, explain how you used each one.

You absolutely have to use InDesign to do this correctly. You could design elements (like your cover or ads or logo or whatever in Photoshop or Illustrator, but it has to be put together with InDesign.)

SAMPLES from previous students

Your document setup will look like this:

 

You can (and probably should) just leave your pages laid out the way they are created:

SAVE your file On your Computer and in OneDrive (and make sure OneDrive is running on your computer!)

You will be creating a magazine about a topic of your choice (school appropriate….) It could be about your favourite sport/team, favourite animal, a place you like to visit, or just make one about Westwood Collegiate! Pick a topic that is interesting to you and that you already know something about.

Magazine topic ideas:

  • Music / Musical Instruments (finding high quality photos of your favourite bands/artists could be tricky, so you may want to keep it somewhat generic, eg. about guitars or something like that.)
  • Cars
  • Animals – you choose your favourite animal or type of animals (eg horses, barnyard animals, whales, sea animals, etc.)
  • Food
  • Vacation/Travel (where do you or would you like to visit)
  • Household items (around the kitchen, tools, furniture, etc.)
  • Makeup/Beauty
  • Sports
  • Westwood Collegiate
  • another topic APPROVED BY ME

You need to have HIGH QUALITY IMAGES in your magazine. I HIGHLY recommend using a photography site like Unsplash or perhaps Flickr where you can download high quality photos!

You will have ARTICLES as well. You could write those yourself if you really want to impress me, but likely you will find your text online. Using a site like Wikipedia would be acceptable, but you’ll have to do some work to make text copied from there look good.

Whatever you choose to do, you must have:

  • An appealing cover page that lists some of the content inside of your magazine.
  • 12 pages, all containing good quality content
  • Pages must be numbered! No page number on the front or back cover! You can decide whether there’s a separately numbered table of contents page or index. InDesign must do the numbering for you! (ie you can’t just add a text box on each page and write in your own number – CHEATING!)
  • It’s rare for a magazine article to contain only one photo. You could have one larger photo alongside text or multiple photos on most pages.
  • Remember that magazines have different articles with different authors. While it isn’t important for you to write a lot in your magazine, you should have some appealing text setting the different articles apart. You should have an author listed close to the article title, and there should be some kind of text alongside the image(s).
  • Magazines contain advertising. Often, a lot of advertising…

Perhaps most importantly, you need to incorporate (and explain how you used) the 4 main principles of design:

  • Contrast
  • Repetition
  • Alignment
  • Proximity

You also are going to learn and apply new and important concepts:

  • Parent Pages
  • Text Wrapping
  • Paragraph Styles

The first step is to decide on a topic and find some content. This is going to be very important because you’ll be marked on how realistic/interesting your magazine is. It should look like something that someone might actually buy.

You have a fair bit of creative freedom here, but you have to make sure that your content is appropriate and that it makes a good magazine. You also of course have to use all of the tools you’ve learned in InDesign to create this properly.

 

There are some older tutorials that could help you get started on this, however, some of the SETUP INSTRUCTIONS ARE DIFFERENT IN THE VIDEO. Especially if you would like to print out your magazine, please use the size and settings you see ABOVE.

Design Principle 2: Repetition

First, make sure you understand how to effectively use contrast. Review the last assignment if you aren’t sure.

Here’s a good review of Contrast, and a look at the next principle, Repetition (stop at 3:46 for today. You don’t need to worry about the other two elements yet):

Just like Contrast, Repetition can be used in different ways. You can repeat colours, fonts, shapes, design elements, layout styles, and more. You will once again try to incorporate at least 3 different types of repetition. Also, keep Contrast in mind and use Contrasting styles and elements effectively.

Here’s your task:

Congratulations! You’ve just opened a brand new restaurant. Now, to design the menu! Use Repetition and Contrast when you’re creating it to make it look great, and to help draw attention to or away from elements.

When you are done, you will also include a reflection that explains how you used repetition. Mention at least 3 repeating elements and how they help your design.

Use InDesign to create this. Set up your page like this:

5.25 inches wide

8 inches tall

4 pages (turn on Facing Pages)

Bleed: .125 inch

Or you can set it up like the page below:


You’ll need to adjust the layout of your pages so we can print this out later.

When you create your document, your pages will look like this:

You need to go into the three stripes at the top right of the Pages panel and TURN OFF “Allow Document Pages to Shuffle” but LEAVE ON “Allow Selected Spread to Shuffle.”

Drag page 4 so it is RIGHT BESIDE page 1. Pages should renumber and look like this:

When printed, your pages will appear like this:

So keep in mind that the front of your menu is on page 2 and the back is page 1.

Once you set up your document SAVE IT IN ONEDRIVE (and of course, make sure OneDrive is running on your computer!)

To make life easier, you can leave out the prices and just list the items you’ll sell. Believe me, if you want to list prices, you’ll probably do it wrong and I’ll probably lose my mind. We’ll get into that later…

A restaurant menu usually has a few different categories:

  • Appetizers
  • Main Course
  • Side Dishes
  • Dessert
  • Drinks

Use design elements (shapes, images, icons, colour, etc.) to separate the categories. Make a list of what you’d serve at your restaurant. Have fun with it!

Make it look IMPRESSIVE and PROFESSIONAL. No more goofy clip art. Find HIGH QUALITY photos from Unsplash if you can. Use icons from The Noun Project if you’d like.

Here are some samples that I like:

Photoshop Sign Modification

This is a pretty easy project that will review some skills and hopefully teach you a few new ones, as you take a picture of an existing sign and change the letters to say something new and creative.

PLEASE USE ONE OF THE PHOTOS I HAVE PROVIDED OR TAKE YOUR OWN PHOTO. If you want to use something else, you MUST DISCUSS IT WITH ME FIRST.

Click this link to choose one of these signs, please OR borrow a camera and go find a sign to change. Make sure the light is good and take your photo STRAIGHT ON (the more level and even it is, the easier this will be).

It is possible that you MIGHT find something useful on Unsplash. If you want to look there, you can, but you NEED TO SHOW ME YOUR SIGN FIRST. I will tell you whether it’ll work or not. https://unsplash.com/s/photos/sign

Your job is to match new text and elements to whatever is on the original sign.

The more you change, the better your mark will be. If you change one letter, your mark will be MUCH lower than someone who makes a lot of changes.

Be creative and original! Believe me, I’ve seen more than enough “STOP” signs changed to “GO.” I never need to see that again. It wasn’t that interesting the first time.

Some tips:

You can use Photoshop one of two ways:

QUICKLY or WELL

Guess which one I want… If you’re doing this quickly and get it done in a few minutes, it’s going to look terrible and I’m going to ask you to do it again. This project should take some serious time and effort. You’re going to mess things up and redo or fix them. It’s part of doing a good job.

You do not need to create a new file. Just open the sign image in Photoshop and…

ALWAYS make a copy of the original sign before you start. You should have a layer at the bottom or turned off with the untouched image of the sign!

If it’s obvious that you changed your sign, you did not do a good job. If it’s easy to tell what you changed, you did not do a good job. If you did not do a good job, you will have to go back and try again.

Start by CAREFULLY SELECTING elements to replace. Please DO NOT REPLACE EVERYTHING! Your job is to match new elements with what is already there, so don’t get rid of everything!

Please make sure you know how to CAREFULLY SELECT objects using different SELECTION TOOLS. Look here for some tips/review/info: Photoshop Selection Tools

Video instructions/examples: (use headphones. Watch the video for a while then pause and do what I say, repeat until done)


Examples:

Interactive Quiz

Your next project will use InDesign in an interesting way. Hopefully by now you know that InDesign is great for creating documents for print, but you can also use it to create all kinds of documents and files and projects online as well.

You will create an interactive, multiple choice quiz. You can make yours about whatever you are interested in. I’d suggest/encourage you to ask questions about yourself, since that’s a subject that you know more about than anyone else! This way, we get to know each other better. If you prefer, you can make a quiz about whatever you are interested in & passionate about, like hockey, dogs, Pokemon, music, or whatever else you specialize in!

  • You will start from a blank document, not a template!
  • Your quiz will have a title/welcome page
  • You may wish to have an intro page that explains what this thing is and how it works (optional)
  • You will come up with at least 5 multiple choice questions
  • Each question will have at least one right answer and at least one wrong answer
  • Each question will have corresponding “Right” and “Wrong” pages (these can be copied to save you some work!)
  • There will be a page at the end that tells the viewer that the quiz is over and will offer a chance to try the quiz again
  • Each page should have AT LEAST one HIGH QUALITY image on it.
  • You will use your design skills and add elements to make each page look amazing!
  • Do not use the default font! Always make your own design/appearance choices.

These will be published online, so you could easily show these to friends & family outside of school. The link is private, so nobody will just stumble on it, but do keep in mind that you are publishing information online, so you may wish to keep personally identifiable details out!

 

Here’s my example:

Video tutorial: (NOTE! Never watch the entire video when it’s as long as this one (sorry not sorry.) Watch a little bit until I do something, then pause the video and go do what I showed you in that section. Come back and watch a little more, pause it again, etc.)

part 2:

part 3 (adding the buttons and links that make it interactive!)

Finally, once you’ve got all of the links in, it’s time to check it out and hand it in:

To get started, open InDesign. Click either the Windows logo on the bottom left of the screen or the magnifying glass next to it
Start typing Inde
Open it!
If you see that Web preset, that’s a great size.
If you don’t see that preset, you can set it up yourself by clicking New file
Mine looks like this: (1920 x 1080 pixels)
The first thing I notice is that my file isn’t saved properly. It’s called Untitled. I HATE that!
Before saving, make sure that OneDrive is running on your computer!
Go into the File menu and choose Save As (or Save, or press Ctrl + S)
Save it in OneDrive!
You might even wish to create a folder for this class if you have a lot in your OneDrive, like I do. Your file should always have the name of the assignment (quiz) and ideally it’ll have the content/theme of the assignment (this one’s about me), so the best file name would be something like QuizRobson (because it’s a quiz about me!)
Much better!
Up at the top of the screen, you have different Work spaces you can choose from. You’re probably on Essentials now.
For this project, the Interactive for PDF work space is perfect, so I’m going to choose that one.
One of the most important panels you’ll use is Pages. To open or close that, click on the top icon in the bar on the right of your screen.
If you want to make life easier for yourself, you may wish to set up things that will be the same on every page. In my case, I want the same background on every page. To add an element to every page, double click on the A-Parent page. Any changes made here will be applied to every page that uses the same Master.
To give this a background, there are a few tools you could use, but I usually just use the Frame tool for a lot of things. Open the rectangle with the X through it, or press F on your keyboard to activate it
Click in a corner to start drawing a box. When we’re creating a print document, we always make the background a little bigger than the page. That’s not really necessary here, but it’s a good habit, so I’ll do it anyway. I’ll draw out a box that’s slightly bigger than the whie page.
Right now it’s transparent (no fill), so I’ll change the fill so it has a colour
You can choose one of the preset colours in this swatch:
Or double click that fill box and you can choose your own colour
Use the slider on the right to choose brighter or darker colours
Then move the little circle to find the right shade.
The box on the top is the colour I have selected now, and the bottom is the colour I had selected previously.
Of course, if you happen to know the colour values for the colour you want, feel free to type those in (or play around with those numbers and see what you end up with!)
ADDING IMAGES:
You’ll want pictures on your pages. I’ll add a Westwood logo to all of my pages.
The Frame tool looks like a rectangle with an X through it. You can also press the letter F on your keyboard to access it.
With the Frame tool activated, just draw a box wherever you want it:
If you want to move or resize it, you need the Selection tool (press V or Esc)
Find an image you want to place in the frame. If you want a Westwood logo (and you don’t need one, but if you want it for this project or any other, they’re on your class page or here: Westwood logos
TIP: You may wish to place all of your images into a folder in your OneDrive! Images Placed into your document are not embedded, so if you open the file on another computer or move a file, your images will be unavailable until you locate the files again!
To Place your image file into the frame, go into the File menu and choose Place (shortcut: Ctrl + D)
Navigate to where you stored your photos (again, somewhere other than Downloads is wise when working with InDesign!)
Place it in. You might notice that the picture doesn’t fit properly, like mine:
In the Properties panel on the right hand side of your screen, or the tool options bar at the top, you’ll see some Frame Fitting options:
The ones I use most are the first two. The first one will Fill the frame proportionally, which means that it’ll fill all of the frame’s area without stretching or squishing the photo. Unfortunately this means that the photo might get cut off:
The second one is better for me most of the time, because it’ll fit the entire photo so nothing is cut off, but the entire frame area might not be filled. In most cases, I can just adjust the frame’s dimensions afterward.
You’re welcome to explore and test out the other options to see which is best for you.
One thing I HIGHLY recommend is getting into the habit of turning on Auto-Fit. If you resize the frame later, Auto-Fit will make sure that the picture inside of the frame will be resized as well. If you don’t have it on, you can resize a frame and have the photo stay the same, so it either ends up being too small or too big for the frame.
Now I see that my background colour looks awful beside that logo and I want the background to be the same colour as the maroon around the logo.
Use the Selection Tool and click on the background frame
Once again, select the Fill colour, either on the top Tool Options bar or on the Properties panel on the right
I want the colour of the logo. I could try to find that colour myself, but I’m never going to get it exactly right
 
At the bottom of that color picker panel, there’s a little eyedropper.
If you drag that eyedropper onto anything on your document, you can pick up the exact same colour
Now I have selected a colour that actually matches the logo
Much better!
Now that I have that background and that logo on my Master/Parent page:
It will apply to all new pages, so they will all look the same
Make sure you switch out of the Master/Parent page and double click on page 1 in the pages panel.
We’re going to add some text, so switch to the Type Tool (press T)
You need a text box, so with this tool, you can click and drag out that box:
Make sure your text looks good! ALWAYS take the time to choose a font that’s going to look good for this document’s purpose and will be effective in communicating the information you want people to have. The default is too small and not very interesting:
You may also want to change the Fill colour
For larger, title text, you may even want to add a Stroke (outline.) Strokes don’t make sense on small text, so only use it for really big titles or larger text
Speaking of larger text, when I go into the font size box, it only shows up to 72 pt, but that still looks too small on my page
You can either use the arrows up or down to change your text size
Or click in the box with the number and type in your own number
To the right of all of that, you may want to center your text, or choose one of the other alignment options

Assignment Drop Off

So you’ve finished your assignment, have you? Well, here’s what to do once you’ve reached that point.

FIRST: go back and check the assignment instructions and/or the examples and make sure that you’ve completed your work correctly! Save yourself from having to fix up your work or redo it by making sure that you’ve followed ALL of the instructions!

NEXT: make sure that your file has the correct name! The name of your file should reflect the name of the assignment! (for example, if I asked you to make an Interactive Quiz, the name should reflect the subject AND the assignment. Mine might be called RobsonQuiz.pdf). If your file name is unnamed (eg: Doc1.docx or something like that), I probably WILL NOT OPEN IT. I’ve got better things to do. Tell me which file I’m looking at and I’ll look at it!

Log in . Use your computer user name and add @sjasd.ca ex: u.user@sjasd.ca

You will see a sign in page that looks like this:

Fill in your user name and add @sjasd.ca (ex: u.user@sjasd.ca)

After that you will see a sign in page for our school division:

Again, your user name @sjasd.ca

You might get a pop up asking whether you want to stay signed in. This will save your login information and may save you some work later. So long as you log out of your computer when you’re done, nobody can get into your account (unless they have your password, which would be a BAD IDEA!)

CREATING YOUR HAND IN FOLDER

At the top of the screen, look for the Blue Button that says + New. Hover over it, and choose Folder from the drop down menu:

A window will pop up where you will name the folder. It ABSOLUTELY NEEDS TO HAVE: your last name, first initial, and what class it’s for. If I were creating one for GT20, it would be called RobsonJ GT20.

Once the folder is created and NAMED PROPERLY, press the Share icon (or press the three vertical dots and choose Share:

Be careful. If you see this name pop up, it’s NOT ME. Yours will probably display the correct name, but just in case, DO NOT CHOOSE Jeremy Robson

If for some strange reason I don’t show up, click Search Directory. Look, there’s me!

YOU ABSOLUTELY NEED TO MAKE SURE THAT I CAN EDIT THE FOLDER! It’ll default to giving me access. DO NOT change that.

Press Send:

Now I have your folder! Wasn’t that easy? You only need to do that ONCE PER CLASS! If you happen to be in two of my classes (I’m so sorry), you need TWO folders.

Next, I REALLY recommend using the OneDrive app on your computer to synchronize your files. Believe me when I tell you that it’s much easier and more convenient!

The easiest way to open a program is to use the magnifying glass at the bottom of the screen.

Type in OneDrive (or a portion of it)

Sign in with your email address. This is your computer user name @sjasd.ca (eg: j.robson@sjasd.ca)

If you type that in correctly, you wil lbe directed to this password screen:

If you see a different password screen, you’ve typed in your email address incorrectly. Try again!

There are a bunch of screens you can just click past:

I HIGHLY recommend installing the mobile app on your phone/tablet. We’ll talk more about this.

This stuff is good to know. We’ll talk more about this too, but you can have your files “in the cloud” (not actually on your computer right now, but accessible), downloaded and available for now, but can be moved back to “the cloud”, and Always available, which means you’re keeping a copy on your computer at all times.

Here you can decide which of these folders on the computer you’re using RIGHT NOW will be synchronized in your OneDrive account online. If you store files in any of these places, back them up!

Finally you’ll be done and can check out your folder:

In your OneDrive folder, you need to create a Hand In folder for yourself. I can do it for you, but it’s more complicated if I do it on my end. Go into your OneDrive and create a folder. It should have:

your last name first initial class

eg: RobsonJ GT20

In the future, I’ll remind you to save your files into OneDrive as soon as you create them. If you’re used to saving your files in your Documents or somewhere else (please don’t save everything on to your Desktop! My mom does that and she’s 70! Don’t be a boomer!)

When it comes time to hand something in, all you need to do is move a file into that folder that you created and shared! When a file is FINISHED, move it into that folder from wherever you saved it while working on it. DO NOT HAND IN ANYTHING  UNTIL IT’S READY TO BE MARKED!

Once I have looked at your work, I will move it into a folder called _MarkedWork. YOU SHOULD NEVER PUT ANYTHING INTO THAT FOLDER! I’m the only one who moves things into that folder. If you put files in there, I won’t see them and won’t go looking for them!

When I’ve marked something, I will move it for you. You will also see a rubric with your marks. You should LOOK AT THAT!

Check your mark. Do you like it? GREAT!

If you aren’t happy with a mark, you can see what you missed, work on it some more, and hand it in again! You can (and should) always have 100% in my class, because you can redo assignments any time you like! If you work on something again, just move it out of the Marked Work folder when it’s ready for me to look at again!

 

 

You can use the website if you wish or you don’t want to sign in to the app. Just go into the folder on the website and press Upload to send me a file.

Then nagivate to find your file(s):

Once you click Open, you should see it appear on the webpage after a moment. If you do, I have it!

DROPPING OFF WORK

Find the folder that you shared with me. It should have your last name AND course number on it (eg: RobsonJ GT20)

Go into that folder by clicking on your name or the little icon (picture of the folder)

Here is where you will upload work for me!

NOTE: You can make your life easier in the long run by using the OneDrive application on your computer to automatically store/upload your work. To do that, click the Sync button:

This will open an application on your computer. You may need to sign in AGAIN, but it’s worth it!

If you don’t do that  (which is FINE) you can just upload your work into this folder. Click Upload:

Then nagivate to find your file(s):

Once you click Open, you should see it appear on the webpage after a moment. If you do, I have it!

IMPORTANT NOTE: MARKED WORK

You should see a folder called _marked work. This is where I put your work AFTER I look at it.

YOU should NEVER put files INTO that folder! Only I put things in there. If you upload a file into that folder I WILL NOT SEE IT!

Once I’m done marking your work, you should LOOK INSIDE that folder and download your work to check for comments, suggestions, or to IMPROVE your work/mark!

If you open a file that has been uploaded to OneDrive, you may be able to view or work on it right on the website:

This version of the program does not contain all of the features of the desktop app though, so things may look a little weird and some things that you need/want to do may not be available. FYI!