Class Feedback - Final

Finally, Final has come. :)
I feel both nervous and released.
This week means the end of the class.
No more homework. \\^o^//
Actually, I'm pretty satisfied by my work.
I think the website has done perfectly.
Flawless. I don't know what to say
but I'm happy I did it.
I did something I've never done before
and I did it well.
Thank you Mauro and my classmates
to critque my work.
It helps my work improved a lot.
Specially thank my roommate.
She helps me solve some problems
that I can't solve at first. :)
Now what I'm worry about is my presentation.
I'm not sure if my client will come,
but for sure, there will be lots of people show up.
That's why I'm nervous, I'm anxious.
I really hope that for the presentation today,
everything is gonna be fine. >_<"
I hope I'm gonna be fine.
Again, almost a summer time. YEAH!!!
See you around, guys. :)))

Class Feedback - Website

Basically, this week I focus on my Flash. Try to solve previous problems from last week and try to finish my work as much as possible. Now I still have some way to go but since all of the problems have been solved, I think it will not hard to finish all of it before next week. Pretty happy and satisfied my work. :)

Class Feedback "My Website"

This week, things are getting more serious.
Everything is deeper and harder.
I have a hard time to create things new,
so may be this week (a very short week)
my work doesn't show much progress. :-(

Class Feedback

Well, it's hard to say that now I start doing something on Flash. Things are still not clear for me; how to crate this, how can I do that. I started it without so many directions. But things become better and better. I did trial and error for many hours, just for one section. However, I fortunately have a friend who study in New Media major, so she can guide me sometime. And then it's my job to do the rest of it. :)

My Wireframes' Development for this week...

Here are my wireframes.

As you see, I changed some and add some.

Hope they look better. :)

Class Feedback - Again

This week I've spent time for watching VDOs on Lynda.com about Flash CS4 for Designers, for all of it! It is because I need to prepare my Flash knowledge for creating my website. I know that it will take a bunch of time so I need to finish it as soon as possible. It took me for about 8-9 hours totally. Sound not a lot for one week, right? But it really takes time. I feel so dizzy and bored a lot but I had to keep watching. Until it nearly ended, I felt like I want to throw up. Everytime I stared at the rest link, I felt so scared. It was very intense!! Anyway, now I feel very happy that my attempt is succeeded. Finally, I finished it.

However, I don't quite understand very well because I think the VDOs are for people who have some background knowledge about Flash before, but I don't. The VDOs didn't say any detail about code but they just use it...Bang Bang Bang!!! What#&%!!? Also, they just taught how to create a part of a website but not for all. Now I don't even know how to create the whole webpage by using all elements combined together. They should have taught me how to create a webpage since the beginning gradually until the final complete. So badddd... :(((

Links to the Original Website

These are the links to original pages of the TMMC website, related to my wireframes' examples:

http://www.tmmc.org/juniormembership/mystery.html

http://www.tmmc.org/juniormembership/rs.html

http://www.tmmc.org/juniormembership/kids.html

My Wireframes' Development

With everyone's comments, My work has been improved...

I fixed my disadvantages and added some features as you can see. :)

Class Feedback "Presentation"

I'm pretty happy about my feedback last class.
I got lots of good critiques and suggestions to improve my website's visual.
It's really encouraging.

Thank you everybody. :))

My Wireframes

Homepage

Scrapbook Page

Learing 4 R's Page


Kids Helping Seals Page

Do It Yourself Page

Class Feedback

I just wanna tell that for a person, like me, who has never had any background knowledge for using Photoshop before, it's really hard to achive the goal. Even though we study a lot through Lynda.com about how to use photoshop for the website, it's still hard. Since I don't know how to use very basic tools. Therefore, I took long time, trying to create something. Finally, I gave up and decided to use Illustrator to draw my wireframes. I really hope that the teacher would teach us how to create a website deeply in the class instead of having presentations... :((

My Site Map

This is my site map for the "Kids for Seals" website from the marine mammal center. It is very detailed but I abbreviate it in order to look easily. :)

My Connection Between Personas

Since I got a contact from the Marine Mammal Center, I have changed my mind about the connection between the personas. Jim, my point of contact, said that the website ((my project)) will change its name from "the Marine Mammal Center: Just for Kids" to be "Kids for Seals".

I think my focus will be on kids...more than adults. So my three personas are gonna be kids who love marine mammals and wanna know more about them and kids who are suggested by their parents and their school teachers about the marine mammals through the website. Of course the website is still sophisticating enough that can make the parents and the teachers think that it's gonna provide their children or students much of knowledge as well as fun for kids. :)

Class Feedback

I have a little problem from last class because I did not understand the homework very well. I did my three personas extremely different so I couldn't find some connections of them. However, through the critiques and time-spending until the rest of the class to figure out the connection, I finally found it. :)

I think the connection would be all of my three personas, a kid, a mother of a child and a elementary school teacher, love activities, seeking for fun and wanna spend their free time usefully.

"Kids for Seals" Poster

Mood Board for 3 Personas

3 Personas ((Redo))

Billy is a chubby boy, aged 8 years old. He is a big bully at school. He likes to pick on weak students to call for attention. His parent is divorced and now he lives with his alcoholic dad. He needs to be responsible for himself and needs to help some of his dad's work. Only one thing can help him relaxed is to play with secretly raised homeless cat that always comes to his backyard. Deep down, he loves animals. He dreams of being a veterinarian someday.

He lives in San Jose and he has heard a lot about San Francisco and its very famous place, Fisherman's Wharf, Pier 39. He's never been there before, even though it's not to far. So he went to the school library, surfs the Internet to find pictures of it. He founds pictures of cute sea lions and a link to lead him to "the Marine Mammal Center" website.

Michaelle and Magan, living in Sausalito:

Michalle, aged 36, is a single mom and a business woman who doesn't have much time for her housework. She earns over 500,000 USD a year and have a house maid to take care of everything in the house, including taking care of Magan. However, whenever she has a spare time, she will spend it with her kid. Since she doesn't have enough time to bring Magan out, she always teaches things such as why birds can fly, why fish needs to be in water and so on to Magan through the Internet. She finds many sources to teach her kid: for example, Google, YouTube and the Marine Mammal Center. Besides, Michelle is a ver clean person who takes time for washing hands for over 5 minutes and love to eat French food in shiny restaurants.

Magan, aged 5, is a smart girl. She knows how to use computer very well, mostly from her mom. She loves to chat with her friends online and loves to type rather than write. She even types faster than some of adults. She loves to eat cereal, loves to collect expensive dolls and loves to create customized stuff such as cards for her mom. She dreams of being Aurora, the sleeping beauty from a Disney fairy tale because she wants to meet a prince charming someday.

Benjamin is a primary school teacher aged 52, living in Sacramento. He teaches the subject of Social Sciences. He is a quite strict teacher but actually he is kind. He is married but doesn't have any children. His routine is the same in everyday. He quite have a boring life. He loves to spend time for reading books and watching TV with his wife. He goes to a church every Sunday. He has been living in the same house for over 22 years so every one around there knows him. He is pretty friendly and always volunteers for public social work. He doesn't like cats because his wife is allergic to them but he raises a talkative parrot.

Interesting Website for Design "Kids' Marine Mammal Website"

This website is about voting for a playground in Chicago. Basically, children send their design to the city, showing on the website and let people vote for the 3 best which will be announced in this March. The winners will get rewards rewards and supportings for their school.

I really like the way they create the icon connected to each other in one big area. You can see the whole picture of it and each of them is clickable and is animation. Of course, there are sounds for each. I also like the way they show information that is not just like putting texts in a box or put in on plain background, in the original web style. When you click to the link, it shows that items on the current page are disappearing one by one and them placing items from the new page more and more.

Credit: http://www.yourplayground.org/#

Class Feedback and Lynda.com

Last week, in the class, I like that the teacher has some exercises that are related to our homework because it helps me to imagine what the homework will look like and what I should do. Kind of, I can get some practicing before know what the direction is. Besides, I like the way that there were some activities in class and it's not boring.

About Lynda.com, this week we are focusing on "Photoshop for the Web". It's pretty intense because now we're going to focus more on the program and tools and tricks that will help us to create a good website. I don't know for others but for me who has no background knowledge for Photoshop and other programs before, it's very helpful. Lots of tools that I've never known before are showing on the website. It makes me really think that when I finish learning each videos, I definitely get something from it. :)

Personas

Billy is a chubby boy, aged 8 years old. He is a big bully at school. He likes to pick on weak students to call for attention. His parent is divorced and now he lives with his alcoholic dad. He needs to be responsible for himself and needs to help some of his dad's work. Only one thing can help him relaxed is to play with secretly raised homeless cat that always comes to his backyard. Deep down, he loves animals. He dreams of being a veterinarian someday.

He lives in San Jose and he has heard a lot about San Francisco and its very famous place, Fisherman's Wharf, Pier 39. He's never been there before, even though it's not to far. So he went to the school library, surfs the Internet to find pictures of it. He founds pictures of cute sea lions and a link to lead him to "the Marine Mammal Center" website.

Dakota Fanning is a 15 years old kid who is an American actress. She lives in Los Angles. Her father was a minor league baseball player for St. Louis Cardinals and her mother was a professional tennis player. She is well-known for the films like Man on Fire, Wars of the World and Charlotte's Web. But now she is offered the role of Mary, in the upcoming film "Mary and Rona".

The story centers on Mary, a cute city girl who is heart broken by a boy he secretly likes, a boy whom she finds out that he is actually gay. She is so sad that her family needs to bring her on vacation to her grandma's house in Oakland, where she meets and becomes friends with Rona, a baby sea lion. So to perform well, Fanning needs to do some researches about this little cute friends, the sea lions through the website and some other sources.

Experience Map for "the Marine Mammal Center" ((Just For Kids))

This experience map shows circle items that will refer to links on the website. Different colors refer to different topics and different sizes refer to the difference of the topics' importance. They are placed a little bit in an alignment which means that they will appear in a little bit well-orgainized on the website. But as you can see, each topic is important by itself so it doesn't matter which one will come first. They audience always can play around as which one they wanna see first and then see the others, and then they may come back and forth to each one again and again. Even the next time they visit to the website, since the information is for kids, they can choose what ever topic they like back and forth. It's not in order.

Just For Kids!!

So..."Just for Kids" website for the Marine Mammal Center is basically for kids to learn about marine mammals and the center's work. It also tries to create funs for kids and encourage them to become volunteers, get their parents to become volunteers, and encourage donations.

In this site, there are 12 main links which each clicking botton has their individual sounds and animations:

- Videos of Northern Fur Seals

- Kids Newsletter

- Poster Contest Winners, showing drawing pictures and names of the winners.

- Kids Helping Seals, introducing kids who become volunteers at the center.

- Scrapbooks, showing pictures and medical histories of some rescued animals.

- Learning 4 R's: Rescue, Rehab, Research and Release, which are all learning through videos.

- Listening to Sounds of each kind of marine mammals.

- Visiting Patients, showing brief stories and pictures of some rescued animals and explaining works of the center.

- People behind the scenes: questions and answers of staff veterinarian, assistant director of education, marine biologists about their work and how they become what they are and the link for career resources.

- General Questions to veterinarian staffs.

- Fun Downloads and Games.

- Matching Marine Mammal Game for kids.

Link to the homepage: http://www.marinemammalcenter.org/juniormembership/index.html

"Google" Experience Map

This is my first idea of experience map when you use "Google" website. First when you get into the website, you need to take time to find what you really want. But more and more you surf it, you become more clear how to use the website and you can narrow it down easier. Finally, when you go to the website again, you can find what you want faster than ever!

"Just for Kids" Marine Mammal Center.

I finally know what my topic is. It is "Just for Kids" Marine Mammal Center. So basically the website contains lots of kid's stuff but not too much information for adults such as what, when, where, why, how, etc. Therefore, just to let you know what "the Marine Mammal Center" is about, I will mention briefly about it.

The Marine Mammal Center was founded in 1975 and is located near Rodeo Beach in Marin County, California. It is a private non-profit U.S. organization centered on rescue, rehabilitation, environmental research and education regarding marine mammals such as cetaceans and seals.

The center rehabilitates a strong fraction of the animals like California sea lions, Northern elephant seals, Pacific harbor seals, fur seals, dolphins and the endangered species Southern sea otters and releases them to the wild without medical research conducted using the rescued animals. Just valuable scientific data is collected through routine diagnostic and necropsy analyses to assess disease pathologies and relation to the marine environment.

Scientists at The Marine Mammal Center collaborate with their counterparts around the world in working on complex individual animal treatment cases, and also participate in joint research projects regarding interaction of ocean dwelling mammals with the marine environment.

Facilities include the Marine Mammal Center at Marin Headlands headquarters, Sausalito, Monterey Bay, Moss Landing, San Luis Obispo, Morro Bay, California, a veterinary hospital, records room, food preparation and storage rooms, rescue equipment storage area and The Marine Mammal Center Store · Sea Lion Information on the west side of the second level of PIER 39.



For more information: visit the Marine Mammal Center at http://www.tmmc.org/

Class Feedback

For Digital Design Studio class, I really have no idea what it's gonna be...

I don't know whether the teacher will teach us about CCS, Dreamweaver and Flash or just let us study from Lynda.com and then just only discuss and present in class...

Let's see this week how it's gonna be.


PS. He is still me favorite teacher no matter what. I just like his casually teaching style. ;))

Another interesting website :))

Hi guys,

This week I found a good one, very interesting...for me. ;) It's a website from Nissin cupnoodle, Japan. When you open the first page, it will be an animation, kind of video...but I cannot copy that so...you need to link to the website by yourself.

Here is the picture of the website:

Credit: http://on.cupnoodle.jp/

Interaction Design: Process and Inspiration from Lynda.com

Still, I like it because the website divides each part into short videos which make me easy to catch up. And it's not boring at all...the speaker presents it like telling stories, talking to friends and then he shows lots of picturesfor supporting.

This week, we suppost to study about Interaction Design: Process and Inspiration (credit: Lynda.com) and here is what I learned.



APPROACH:

- How to generate ideas ---> look at things around you, it's everywhere; in a kitchen, at a door, in a bathroom, or in a sketch book.
- Sketch ideas or storyboards for designing a website.
- "Put yourself in the audience's shoes"
- Did it for some reasons ---> not just show off skills in Flash.


DESIGNING FOR MY MUM:

- Think of the audience: for example, mum, and design it for them.
- See who is your audience.
- Create it visible ---> people doesn't have to have knowledge to get understanding it.
- What shouldn't do ---> too much showy flash skills ---> it's too noisy and annoying.
- "Be matured and experienced."


'NEED TO KNOW' DESIGN:

- The audience just want to know what's on the website, not need to know how (fast) you create it.
- Use aesthetic designs, not showy.
- "Make things relevant but make it looks different."


WELCOME TO PLEASANTVILLE:

- Exploring, playing, breaking things ---> don't afraid to make mistakes ---> try new things, be brave.
- Exercise your brain "MORE".
- Experiment to do something new.

(continued)

- Sounds ---> narrow graphics on the page.
- Insert code ---> try many different things and see the results.


TWISTING DATA:

- How to present the data.
- Java can create something: for example, graphics with sounds, much richer than Flash.
- Experimental work ---> playing around.


EVERYDAY ORDINARY INSPIRATION:

- Something that's normally looked: for example, at the bottom of the McDonald bag has some interesting graphics.


USABILITY VS. ENJOYABILITY:

- Do it not only functional, but also "enjoy" ---> interaction.
- Some people like and dislike the interaction. Some want just quickly finding information.


FUSING INTERFACES:

- Challenge doing new things
- Think about things in a different way.
- Make it different ---> make it unexpected.


THOUGHT SPACE:

- Taking an idea from brainstorming and do it further.


TOUCHY FEELING:

- Explore a physical making.
- Look for inspiration.



THE END :D

The Marine Mammal Website

Then I visited the marine mammal center's website. And here is its homepage...



The homepage is filled with many shades of blue colors which is the right color concept for anything related to sea and ocean. And for me, blue is my favorite color! :))

And I think the pictures shown on the homepage will gradually change...may be everyday or may be once a week, I'm not sure yet. ;)

On the left side, you can see the illustration of a sea lion rolling his body to be like a water drop shape... It's the lgo of the center. Also, it's an animation...it moves when you first open the homepage including some sounds of ocean's waves, which is kinda cool.

.
.
.

However, I think this website contains too much information. You can see a bunch of links, probably over 100 links spreaded everywhere. I don't know for you, but for me, it makes me feel getting lost. I don't even know where to go, how I should start...

This is an example of links links links and links on the website (which is just only started).

It seems to have other links on almost every individual page. -__-" Some are contained so much that it's confusing, it's repeated...over and over...

Here is some page showing links that are very confusing.

As you can see, the links for related topics are on the left side. And then there are the same links plus some other links on the right side.....What?? Besides, if you look at the top of the page, you can see boxes of links, showing the same thing!!

From seeing all of this, even though I have no experience about how to create a website, I surely know that this's gonna take looooooooooooooong time to do it. TnT

Here are the link for the website (there are two which are exavtly the same, I don't know why. -__-") :

http://www.marinemammalcenter.org/

http://www.tmmc.org/

My Project

My topic to crate a website is "Re-opening the Marine Mammal Center", the project number 14. Fortunately, I was the first person to choose it so it is really what I like. I love animals and most of all, I love sea lion. :))

Here is my project page. You can see the sea lion cute face and you may feel that you wanna hug him and touch him so bad...just like me. :)

And next step... On the next day (of the class which will be on Wednesday), I gave a call to Jim, a person according to the point of contact. He didn't pick up so I left a message. However, he called me back on the next day (Thursday). We talked for a while and he said that now he already had someone to recreate the website, which was still in the process. He said he didn't want me to create a website but create graphics, posters or brochures instead. @_@"

So I said that I'm doing a school project for a web design class so in this case, I need to create a website and the website that I will create doesn't need to be use for real. And he said that he asked George for finding someone to create graphics, not a website, so...he thinks that it might be a mis-communication. So he said he's gonna write an email to ask George about this again. Also, he asked me to send all information I have about this class to himso I sent the class plan file (in word program) and the Design Projects file (in PDF) already.

Since I don't know now what to do, I think I will initially stick to the first plan which is finding information about the project. *_,*'

.
.
.

Let's see what's going to happen next...

Interesting Website

I found a really good design website, I think. It gives you an idea about economic for living. There are animations, going on in every page. It's very intersting and very detailed. You can enjoy surfing while learning the economic things.

Here is the picture that we can see while loading the website, very unique. :))

.

.

.

Here is the link for the website:

http://ge.ecomagination.com/smartgrid/#/landing_page