here is my writing
Friday, September 10, 2021
Tuesday, May 22, 2018
e-Communication Summer Assignment 2018
Overall
- Create a new Blogger blog. You will need a Gmail address to do this. Go to www.blogger.com
- You are responsible for completing each of the modules in the posts below: Graphic Design, Animation, Video, Web.
- Post your assignments to your blog in the order they are below.
- E-mail your blog address to anettervilleonw@olatheschools.org
- Your assignment is due by the first day of school. E-mail anettervilleonw@olatheschools.org if you have any questions.
Graphic Design
Download the assignment here.
Here is the image file for the assignment.
Animation
Here is the Animation summer assignment: interNetterville: Summer Animation Project
Video
- Take notes over the following lessons:
Camera Techniques
Camera Shots
Camera Angles
- You will create a VIDEO RESUME that will market yourself to a college or university.
Download the assignment here. Follow the directions carefully.
Web Design
Click here to download the Web Design summer assignment.
Tuesday, April 3, 2018
Free Stuff!
Copyright-Free Photos
Anything that has been published IS already protected by copyright law, even if there is no copyright symbol or notice -- unless the creator explicitly states that they are giving away their work. Don't just grab images from a search result.These sites are ones where photographers give away photos. Caution: these 3 sites also contain links to stock image sites that are not free.
Do a search, but filter out the copyrighted stuff.
- Google Image search Click Tools>Usage rights>Labeled for reuse. Choose a large enough size for your project. Zero in further with Type and Color.
 |
| Unless you filter the usage rights, you will be seeing copyrighted images that are not legal to use. |
Free Online Image Editors
 |
| Pixlr and other free image editors have become decent alternatives to Photoshop. |
designinstruct.com/roundups/free-photo-editors-online/
Free fonts
You can find fonts on these sites - download the zip files. Open them and then double-click the TTF files to install. Google Fonts is the least likely to be blocked at school.Free software you can download!
The software we use at school can be rather cost-prohibitive for students (and teachers) to get at home. The sites below have free software packages that can be viable alternatives to the commercial software we use at school.
Graphic Design:
- Inkscape (Vector-based - similar to Illustrator)
- Gimp (Pixel-based - similar to Photoshop)
- Online Image Editors
Web Design (visual web editors):
Animation:
Video:
Audio:
Monday, February 5, 2018
Making and installing your custom favicon
What's a Favicon?
FAVorites ICON
The favicon is a very small, square graphic that shows up in browser tabs and other places - favorites (bookmarks), other blog feeds, and more.You may make your own favicon, and install it on your blog.
The trick is to remember two words:
- Square -- The favicon must be square - Blogger will not accept it if it is even 1 pixel off.
- Simple --To turn out legible at such a small size, it must be simple - in shape and in color. Favicons are sometimes one letter, or a simplified version of a logo or icon.
Start with a square image - at a size easy to work with.
Transparency is allowed (PNG and GIF do transparency, JPG no) but I usually avoid it when making favicons.
So, start out with a square artboard in Illustrator. I used 400px x 400px. Create.*** There is a setting you need to tweak so that things won't turn to mush when we shrink this thing down to icon size:
Before you start working, go up to Adobe Illustrator > preferences > general >make sure the two checkboxes to resize corners and resize strokes and effects are checked.
Probably, once this is sized down very small, it will actually look cleaner without any anti-aliasing, so choose none. The edges will look jagged and blocky, because now illustrator is only using one color for the edge.
Use the rectangle tool to make a square, with any fill color that you want. Make sure you have contrasting color between the rectangle and your initial in the foreground.
After the rectangle is made, right-click it and Arrange > Send to Back.
Make a new artboard by clicking the icon next to the trash can.
...
Make sure you have Clip to Artboard checked.
Make sure the size is 16px x 16px.
If something looks wrong, go back and fix it.
In this case, my square and letter were not fitting exactly on the artboard.
I also then had to move the initial over a bit.
To get things to fit the way you want, you may need to uncheck snapping - under View in the main menu.
Go to your layout settings in Blogger, and select your icon for the Favicon gadget.
You may not see it change right away in your browser tab. If you are in Chrome or Firefox, Command-Shift+Delete will clear the browser cache and history, and force it to reload your new favicon. (It will also log you out of Blogger, though.)Websites nowadays actually can use several different sizes of favicons for different purposes - one for tabs, another for icons on a tablet, another for mobile devices, etc.
If you open up your blog on a device that uses a larger size (which will make your 16x16 look fuzzy), let us all know please! Leave a comment below, and we can modify these instructions for a bigger save size.
Have fun personalizing your blog with a favicon! As with everything else, keep it classy.
If you'd like to find out more of the finer points of favicons for website use, this is a good page: Create a favicon for your site in 8 steps
Sunday, December 10, 2017
This is for Everyone
With the current fight for net neutrality in mind - here's a step back to look at the bigger picture of The World Wide Web, and its inventor, Tim Berners-Lee.
Tuesday, November 14, 2017
Social Media Image Sizes
Here are the current 2017 sizes!
Thursday, February 2, 2017
Create something new each day!
Creativity is good for the soul. Get in the habit of creating something every day.
Health Benefits of Creativity
How To Be Creative - great tips and infographic
Wednesday, November 30, 2016
e-Comm For Life!
When you take e-Communication classes, you aren't learning a subject,
as much as a way to communicate - about anything. It's a lot like
learning a new language - except this language lets you sense the world
around you, think about it and feel it, and then communicate it to
others with much more than words.
e-Communication is how you can really reach people.
What are you interested in? What do you love doing? e-Communication
gives you ways to share it with the world, when a vocabulary of words
alone would be inadequate.
Not every e-Comm student is going to end up working in journalism, video entertainment, animation, graphic design, or web design. However, all of you will carry with you the skills from these areas to apply to any future career, hobby, or passion.
To use my own experience as an analogy - music is
what got me through junior high and high school. I earned my bachelors
degree in music. By the time I finished that degree, I realized that I
did not want to be a school music teacher. I taught lessons in a music
store for a few years, while I tried out the life of a "full-time"
professional musician. It didn't take long to decide that wasn't going
to be my life-long career either. I finally got back to teaching school
in other areas than music - BUT all my life there have been countless
little ways that my music background has paid off. It's a hobby and a
love. Through music, I can communicate wordlessly from parts of myself
that are otherwise hidden and silent. I am able to donate my musical
talents to good causes. My life experience would be much less rich, less
interesting, less beautiful - without that background in music.
e-Communication may turn out to be to you what music is to me.
e-Comm
may not turn into a life-long career for you, but it will stay with you
- giving you enriched ways to see the world around you, and to
communicate what you see and what you are passionate about. Your ability
to get your ideas across through some combination of writing, video,
animation, graphic design, and web design gives your communication extra
range and impact.
You may have noticed e-Communication's new slogan:
Sure, we love to see e-Communication alumni make it as professional
designers, animators, broadcasters, entertainers, and so on - but our goals go beyond that. We
especially hope that all of our students take these skills, these different ways of
seeing the world and communicating to others what you see, to enrich your
everyday lives - and maybe even to change the world, regardless of your occupation.
Plus, there's always this, as Mrs. Morris puts it so succinctly:
Mr. Olson
(This is a repost - originally from May 2015 on Mr. Olson's blog - molsononw.blogspot.com.)
Share your passion
 |
| e-Communicate your passion! |
Not every e-Comm student is going to end up working in journalism, video entertainment, animation, graphic design, or web design. However, all of you will carry with you the skills from these areas to apply to any future career, hobby, or passion.
Noteworthy analogy
 |
| It's all about the drums. |
Your superpowers
You may have noticed e-Communication's new slogan:
Communicate, Collaborate, Innovate, DESIGN.This is the stuff that lasts, no matter what crazy new things happen with technology or software in your lifetime. We also hope you take away some project management and leadership skills, in addition to mastering the current technical content.
Use the Force!
Plus, there's always this, as Mrs. Morris puts it so succinctly:
"What we do is cool."
Mr. Olson
(This is a repost - originally from May 2015 on Mr. Olson's blog - molsononw.blogspot.com.)
Tuesday, September 13, 2016
Think you're not a leader? Think again.
Drew Dudley redefines leadership - in a way that aligns beautifully with what we in e-Communication refer to as leadership.
Wednesday, January 27, 2016
"I'm stumped - what should I blog about?"
e-Communication students have occasional required blog posts of various types that we think are important to assist in learning or demonstrate learning of e-Comm material. However, to really have an interesting and well-rounded blog, you may want to also include other kinds of posts."What could I possibly blog about that would be interesting to others?"
Oh - about a hundred things. Seriously. In these two posts, a girl, obsessed lists many possible blogging ideas. If you're stuck on figuring out what to write - scan through these and chances are you'll be back writing great posts in no time:
Oh - and, by the waaaay... one category in this year's eMagine competition is for blogs.
(Also see our To-Do List For a Better Blog.)
Friday, January 8, 2016
Blog of the Week -- January 8
 |
| Visit www.smalltalkwithcorbin.com |
Corey has decided to jump over to the Weebly platform, and combine his blog and portfolio there. (Juniors and seniors in all focus areas are now permitted to use other platforms than Blogger – ask your teacher which platforms will work best for your focus area.)
Great job, Corey!
Tuesday, December 15, 2015
Blog of the Week - Ben Whitney
The Blog Of The Week for this last week of the semester belongs to e-Comm sophomore, Ben Whitney. You may not know Ben by sight, but you would definitely recognize his voice as one of the talented readers of our daily announcements.
Ben is taking graphic design and video, and is doing a great job with blogging project tutorials and reviews. Pay him a visit here: Whitney Designs.
Ben is taking graphic design and video, and is doing a great job with blogging project tutorials and reviews. Pay him a visit here: Whitney Designs.Monday, November 30, 2015
Make a Bio page!
Pages? We don't need no stinking pages!
 |
| Badges? We don't need no stinking badges! |
We will make a page for your Bio information, along with a handy link to it near the top of your blog.
Make a PAGE
In your design menu, go to Pages, and then press the New page button at the top.
(This example was for something different.)
Add in the Content
Edit the page the same way you have been editing posts. This time, you need a photo (a semi professional one), a paragraph of bio info (you don't need as much as this example), and then your elevator pitch. (If you did not write your elevator pitch yet, the instructions are here.)
 |
| You only need 1 paragraph of bio info. Instead of Skills, copy&paste your elevator pitch in here! |
When finished, press the Publish button.
And... nothing happens.
That's because pages aren't blog posts - they come up by choosing them from a menu, as opposed to being displayed sequentially on your home page. So...
Add the Pages Gadget:
Page names are on the left, and will only appear in the menu if you have their boxes checked.
Once the pages are checked, you may reorder them on the right side. By convention, you should either place the Home page first or last.
(Yours will be Bio or About Me, instead of Graphics.)
Press Save when finished.
... in a gadget at the top, in which case it looks like either a menu bar or tabs.
If your gadget doesn't show up, try moving it to a different location.
Test out the link in your gadget to make sure it is working.
Revisit your page now and then to keep it updated!
Here's another quick reference from Blogger on some of the details of pages and the pages gadget that were not covered above: Blogger Buzz
Friday, October 2, 2015
The 5 Guarantees + 3 Superpowers
The 5 Guarantees
By now, e-Comm students can probably rattle off the 5 Guarantees of e-Communication:
Technical Skills, Communication, Leadership, Collaboration, and Project Management
Doing well in each of these areas not only prepares them for careers in their e-Comm focus areas (graphic design, web design, animation, video entertainment, convergence journalism, or sports information), but also many other fields! Sure, we hope to encourage students to go into careers in their e-Comm focus area, but sometimes students also develop other strong interests along their way through high school - or college - or adult life. Will a nurse, a business person, or a pastor benefit from having skills in those five areas? Most certainly!
The Plus Side of Having Multiple Interests
This TED video is precisely about those people that have more than one interest - "multipotentialites" - and the difficulties they face as they try to decide "what they want to be when they grow up". It turns out that "multipotentialites" may also have some unique advantages or "superpowers", bestowed upon them by virtue of their multiple interests or skills.So, for e-Comm students (and their parents) who aren't so sure that they will end up choosing an e-Comm-related career - it's OK! In addition to the 5 guarantees of e-Comm, you might also bring these superpowers to the table in whatever career(s) you find yourself:
Idea Synthesis, Rapid Learning, Adaptability
Here's why, along with a look at some successful "multipotentialites":
Why some of us don't have one true calling - Emilie WapnickFriday, September 18, 2015
Create an HTML Gadget with links and images
Get the files
Head over to this post to get the 2 images you need for this gadget. Once you have them downloaded and saved then you are ready to continue!What are we doing?
We are going to create a new gadget (widget) for your blog. This gadget contains the HTML (the code behind web pages) needed to show the 2 images, along with links to our websites.Even though this will be a gadget, we are going to start out creating it in a post, where we will have more room to work, and where we will be able to upload the images.
Upload the images into a new post
Create a new post on your blog.Click the image icon (to the right of link), and upload the two images from the other post.
Make sure you click on each to get a blue border around them.
In the Compose view of your post, you'll see the two images.
DO NOT:
- drag the images
- right or left align the image
- add captions
- In fact, don't even click on them.
We now switch to HTML mode - and will stay there. Click the HTML button in the above left corner.
(Going back to Compose view and changing anything will cause Blogger to insert extra HTML or modify HTML - making your code look different than that shown in this tutorial.)
Remove the extra code
In HTML view - these are tags. HTML uses tags to set the structure of your page. Tags are enclosed inside a "less than" and a "greater than".
Carefully select and delete the "a" tags, leaving only the "img" tags as shown below. The "a" tag makes a link. In this case Blogger made each image a link to a bigger version of the image, which we don't want for the gadget.
Delete everything except the code shown below - yours should look just like this!:
Now you should just have the two image (img) tags as shown above.Add links
Stay in HTML view.
The "a" tag makes links.
Type in the "a" tags as shown here, three under the first image and three under the second. Also add in the "br" (break) tags as shown. Those are what makes the web browser go to the next line to display whatever is next.
The actual blank lines in the code above are only to make our code more readable - they won't show up in the browser.
Set image widths and floats
Inside each image tag, after border="0", type a space and then add the parameters shown to set a width of 30% for the image, and to float it to the left. You must get all the punctuation just right, as shown. If there is a height declared, delete it.Go up and click on the preview button, and you'll see something like this:
Now that each image floats left, whatever is on the page after it can come up to the right of it (wrap), when there is room.
The e floating left allows the links to come up next to it like we want, but it also made the raven to come up - which we will fix next.
In HTML view, inside the br tags after the sets of 3 links, add in the style shown, like the first one shown here. Clearing makes the browser go below the floated image to place whatever comes next. Now hit the preview button again.
Add an image margin
The links are appearing a little too close to the images, so in HTML view, and inside the quotes for the style in the image tags, add margin:6px;.
Here's how your complete style attribute for the image tag should look now - along with the width.And here's the complete image tag:
Almost there!Now if you Preview, it looks pretty good.
Round the sharp corners
Check it with Preview if you want.
Copy the HTML to a gadget
Your code now looks like this. If it does, select it all, and then copy it (command-c).
Save your post, but don't publish it.
Go to edit the Design of your blog.In that menu, choose Layout.
Find your sidebar, and click Add a Gadget.
From the list of available gadgets (known on most blogging platforms as widgets), choose the HTML/JavaScript gadget.
Paste your code (command-v) into the Content window, and title the gadget.
Press the Save button.
Your gadget should look something like this!Your fonts, font sizes, and colors will be different than mine, depending on the template that you are using for your blog.
Clean it up
Click the "tools" icon to edit your gadget.
It will look better to make the links line up with the tops of the images, so select the br tag between the image and the first link, and delete it. Do this for both images. Save.
Add a br tag as shown, above the first image only.
Testing and done!
Nice!Test all 6 of your links to make sure they work. This blog gadget is public on the Web when we save it. It's embarrassing to hear from others that one or more of your links don't work. Test all of your links so that you will be the first to know - and then fix them!
If your sidebar is too narrow and the links don't fit well next to the images, you can try changing the width for the images - maybe down to 25% or even 20%.
Purposes of this tutorial
- It gives you a useful gadget for keeping up with what's going on in e-Comm and ONW.
- It hopefully gives you at least a fuzzy idea of HTML tags. You used 3 in this tutorial - the a tag to make a link, the img tag for an image, and the br tag to advance to the next line or insert a blank line. We didn't cover the "how" or "why" behind each tag, so don't worry if it seemed complicated or mysterious to you. When we make tags ourselves later on, they will be simpler - and we'll take them one piece at a time. For now, it is enough that you realize that things showing up on web pages are actually generated using HTML tags. Most of the time we have software generating the code for us, but we do need to know enough to look under the hood and tweak things when needed.
- The other purpose of this tutorial is to demonstrate one way to present a tutorial blog post. To see more examples, click the tutorial label (tag) in the label cloud (tag cloud) to the right.
To see how your tutorial blog posts are evaluated, go here.
Subscribe to:
Posts (Atom)