Transcript Graphics for Scratch In Development Creative Inventions and Robotics www.build-it-yourself.com

Graphics for Scratch
In Development
Creative Inventions and Robotics
www.build-it-yourself.com
Why is it important to know how to make way
cool graphics?
www.build-it-yourself.com
Why is it important to know how to make
way cool graphics?
This is a racing game made with
quick graphics.
This is the same racing game made
with way cool graphics.
www.build-it-yourself.com
The point is that it is very important to
have good ideas and a good game engine.
But it can be just as important to present
your ideas in creative, memorable ways if
they are to get the attention they deserve.
www.build-it-yourself.com
Pixel vs. Vector Graphics
Grow and shrink
Speed
Applications
Pixel
Vector
Bad
Good
Fast to create.
Very hard to
edit!
Slow to create.
Much faster to
edit.
Paint
Photoshop
Power Point
Illustrator
www.build-it-yourself.com
Scaling vector drawings.
Original
Scaling pixel drawings.
Original
Shrink
Grow
Shrink
Grow
www.build-it-yourself.com
We recommend using Power Point for
creating original artwork.
It’s:
1) A ubiquitous tool
2) Quick
3) Powerful
4) Great for story boarding
www.build-it-yourself.com
Which shape is more interesting or more
creative?
conservative circle vs. liberal circle?
www.build-it-yourself.com
Which colors make your imagination wander?
Flat Color
vs.
3-D Colors
www.build-it-yourself.com
Which eyes are more expressive?
Famous paintings often have eyes that are bigger than
normal. Animal photographs are often judged on how well
the photographer has focused on the eyes.
www.build-it-yourself.com
Drawing a simple line for a mouth may be
quick. But can a simple line say as much as
playful shapes laid on top of each other?
Generally, your design may be more interesting and have
more character if you use unusual shapes and stay away
from symmetry.
www.build-it-yourself.com
Which face has more soul?
Which face would you rather
use in your game?
Adding details to your design is often what separates the
average from the way cool.
www.build-it-yourself.com
If there was one part of a body that could
tell you at a quick glance what the nature
of that character is, what part would you
choose? A nose, an ear, a hand. … ?
www.build-it-yourself.com
If there was one part of a body that could
tell you at a quick glance what the nature
of that character is, what part would you
choose? A nose, an ear, a hand. … ?
Eyes are very important!!! Drawing eyes is
one of your best chances for setting the
personality of your character.
Generally, big and bold is good.
www.build-it-yourself.com
Use the AutoShapes / Lines / Curve lines to
create unusual shapes that can be colored.
The line end point must be exactly on top of
the line start point if you want to color the
object.
www.build-it-yourself.com
If you need to change your shape, select
the shape you want to edit. Use the Draw /
Edit Points mode.
www.build-it-yourself.com
To create 3-D looking graphics, click on the
arrow next to the paint bucket. Select Fill
Effects / Two Colors and experiment with
the different effects.
www.build-it-yourself.com
Another way of adding depth to your
drawing is by using perspective.
Conservative Square
Perspective Square
www.build-it-yourself.com
Another way of adding depth to your
drawing is by using size and placement.
2-D scene
3-D scene
www.build-it-yourself.com
Exercise:
Fill in a rectangle using drawing tricks you
have learned including color, gradations,
perspective, depth, exaggeration.
Mondrian
www.build-it-yourself.com
Exercise:
Fill in a rectangle using drawing tricks you
have learned including color, gradations,
perspective, depth, exaggeration.
Monet
www.build-it-yourself.com
Exercise:
Fill in a rectangle using drawing tricks you
have learned including color, gradations,
perspective, depth, exaggeration.
Picasso
www.build-it-yourself.com
Exercise:
Fill in a rectangle using drawing tricks you
have learned including color, gradations,
perspective, depth, exaggeration.
Sponge Bob
www.build-it-yourself.com
Exercise:
Fill in a rectangle using drawing tricks you
have learned including color, gradations,
perspective, depth, exaggeration.
Clare - 13
www.build-it-yourself.com
Exercise:
Fill in a rectangle using drawing tricks you
have learned including color, gradations,
perspective, depth, exaggeration.
Steve - 11
www.build-it-yourself.com
Exercise:
Fill in a rectangle using drawing tricks you
have learned including color, gradations,
perspective, depth, exaggeration.
Build-It-Yourself Student
www.build-it-yourself.com
More tricks …
• Copy and paste
• Group objects
• Order objects
• Rotate or Flip
• Size your drawing
• Animated frames
• Save as JPG
• Cut image sizes in Paint
• Make transparent backgrounds.
www.build-it-yourself.com
Another way of thinking about pixel (Paint)
vs. vector (Power Point) graphics …
Imagine you have a cup of lemonade. A
friend wants a cup too. Which is better?
Pour half of your
lemonade into another
cup and then fill both
cups with water.
Give your friend a
lemon, sugar and water
to fill up the new cup.
www.build-it-yourself.com