Draw a Seahorse! Make her Swirl! Have a great Friday!

Easy steps to Seahorse land…

  1.  Use Microsoft Paint or another free Paint editor to draw a Seahorse.  If you’re using my seahorse, great! Just split-screen your windows and copy. I used the Curved Line tool for the outline and then the Fill Bucket for the pink body.  Polka-dots and spray can for colors.

 

2.  Save your Seahorse to your Desktop to find it easily in a second.

3. Open www.Codepen.io and go to this link https://codepen.io/hudsoncomputer/pen/ZXOYpr

4. Fork this pen for yourself and play with code.  Code below if you want to use another code editor or Notepad.

5. Can you make the Seahorses swirl or rotate faster?

Swirling Seahorses

6.  Code for swirling seahorses.  Have fun!

<!DOCTYPE html>
<html>
<head>
<style>
body{
background:url(“https://s3-us-west-2.amazonaws.com/s.cdpn.io/272446/rainbow%20background2.jpg”);
background-size: cover;
background-repeat: no-repeat;
color: #3BB9FF;
}
a {
color: #43BFC7;
}
a:hover{
color: white;
}

#shark1 {
width: 2000px;
height: 2000px;
animation: swim 12s infinite;

}

@keyframes swim {
to {background: url(“https://s3-us-west-2.amazonaws.com/s.cdpn.io/272446/imageedit_1_5456729698.gif”); background-size: 5px 5px; }
from {background: url(“https://s3-us-west-2.amazonaws.com/s.cdpn.io/272446/imageedit_1_5456729698.gif”); background-size: 775px 775px; transform: rotate(180deg); }
}

</style>
</head>
<body>
<h1> Seahorses! </h1>
<h2> <a href=”https://www.digitalanimationforkids.com”>Learn to draw seahorses and everything else under the sun.</a></h2>
<div id=”shark1″>
</div>
</body>
</html>

 

Author: Stephanie

Everything I learned in my professional career thus far has helped me build simple, image based lessons for my Pixar generation students. After I graduated from college, I moved to Atlanta and starting working as a technology consultant. I traveled across the country installing help desk systems. I was in the role of trainer and explainer and told our clients in plain English what we were installing and how it would help them do business. I wrote manuals and did a lot of hand holding. I always believed that technology was a great equalizer and it doesn’t care if you are popular or you can run fast or if you’re having a bad day. With tech skills you can build anything and to learn tech is everything. It’s not that hard! It just had to be broken down correctly. I knew I could teach tech to kids if I made it fun enough. In 2002, I went back to school and received a masters in public management and IT from Carnegie Mellon University to help my journey.

Leave a Reply