Progress on Tutorial

Week 7:

Website for tutorial:
I have been working on the HTML webpage for my tutorial. I put everything in one page using a jQuery tabs. The tutorial content is so long that users might not want to keep scrolling to go to the content. So, I'm trying to add a ScrollTo code for sliding down to a part of the tutorial by clicking on a link list. This way, it's easier and faster to get to the point. So far, I can't seem to find one that works. I'm still researching for the code. I will also find a code for Back to the top of the page.

Tutorial:
I'm already 3/4 of the way done explaining on the tutorial. I finished up to the part on saving the animation. I'm going to continue adding extras and advanced animation part. I have hierarchy for organizing which parts are important. I have now put big headers for topics and bullet points to keep each part in order. I took a lot of screencaps for the tutorial and marked them in red borders to highlight important areas. I even have demos of the outcome of the animated GIF. I might need to review over the tutorial in the end to check if I need to fix or add anything.

Here's a sneak peek of how the html webpage looks like. I'm still doing some modifications to it, so it's only a rough look:

E-Commerce Affiliate

E-Commerce Site Design [Week 6 blog]

For this week's assignment, we will blog about a product we like and is selling it online. We will talk about our interest in the product and affiliate with a link. I have decided to talk about a movie in DVD.

[Movie] Transformers 2: Revenge of the Fallen

I love the whole series of Transformer. It has a lot of action throughout the whole movie. I watched the movie in a theatre. It was amazing watching in the big screen. I would rate this movie a 5/5. Michael Bay, the director and producer of Transformers had made a magnificent movie with 3 series. All the special effects and robotic characters looked real and well done. Transformers 2: Revenge of the Fallen is number 2 of the series, there is also number 3 that came out not long ago (Transformers 3: Dark of the Moon).

If you have seen the movie or haven't yet, I suggest you to purchase a DVD for yourself! You'll get to watch it right at home in your big screen television with your family, friends, or relatives!

Research

Week 6: Research your final project online and develop a case study to present to class. Include your target audience, main form of instructional strategies, and a sample "similar" site, if possible.

I use Tumblr and make animated graphics for myself during spare time. On what I researched on Tumblr, animated gifs are popular and users like to post them.  Sometimes it's only for fun entertainment and interest. I am going to based on users who make animated graphics for Tumblr.

Why We Love Animated GIFs?
Here's a great article about why we love animated gifs. I agree about when some people are not interest in such animation, it is unavoidable. It's hard not to get attracted to the animation. (Source) These animated graphics are made of frames and animate repeatedly. Sometimes, animated graphics are made for advertising, so it's not only for entertainment. However, some animation can be annoying and marked as spam. The article says, "and yet animated GIFs that show just a few seconds of someone making a funny face repeatedly become exponentially more appealing to someone than a picture of the same person that did not move." I agree because an animation of a picture would be more interesting than a still image with no movement. A still image is boring, but an animation has more movement, meaning, and significance that make sense and attract the audience.

Target Audience:
It depends on the user making the animated graphic. What is the intended use and purpose? Is there a message the user is trying to say? When making these animated graphics, we should know who we are trying to target. (Source) Since making animated graphics are for fun, there might not have any message to communicate through. However, if the audience is interested in what the graphic is related to. The targetted audience are teenagers, young adults, and anyone who would like to learn how to create animated graphics/gifs. I assume this tutorial is for users who already know how to use the basic Photoshop. If not, I might teach a simple basic introduction to Photoshop.

Final Project Proposal

Tutorial: How to create animated gifs/graphics with Photoshop 
Week 5
I'm deciding on to just take screencaps of the program and discuss about it step by step on a page. If that does not work, I will use Captivate and make a video with audio instead.  I am just going to make a tutorial using screencaps and text. No Captivate. 

Content:
Making animated pictures through frames with Photoshop and turn them into gifs. Instead of creating animation with single images like a slideshow, we can make animated pictures with video files. When the animated graphic is made, it looks just like scenes from a video. We can turn the animated gif into looking just like straight from a video.

Media needed:
Photoshop, video file, browser, screen captures. audio? Adobe Captivate? 

Target Audience:
teenagers, young adults, ages 14+, anyone who wants to make animated gifs 

Flowchart pages: 
introduction, instruction step by step, conclusion of summary 

Optional add-ins (still in deciding):
How to create animated gif to post on Tumblr

---

[EDIT UPDATE 8/19/11]: added more for the tutorial

Tutorial with Captivate

Week 4:

Just finished the midterm in class. I have uploaded my demo online. My tutorial is about teaching users how to download a syllabus document file on Casabasa.com! (How to Download a Syllabus on Casabasa.com) The tutorial is made on Adobe Captivate with screen captures. I actually recorded my own voice and used it for the tutorial. I hope it will all tie up together when presenting. I hope I fulfilled all the requirements for this midterm project. I'm sure I added 3 interactions in the tutorial for users to make 3 clicks. I also hope that the tutorial is actually teaching users something. Check out the tutorial!


How to Download a Syllabus on Casabasa.com 

Edit: There are a few errors in the tutorial. I'm going to fix it and add some changes and then re-upload the tutorial again. I have uploaded the final version of the tutorial. I have fixed and made changed to the errors and mistakes. Everything should tie up neatly now with a beginning, middle, and end. Also, there are 3 interactions, the next button, the typing text area, the help widget, and the quiz.