FRONT COVER
u&iPalmReading
My project is designed to reflect or improve my abilities as a project manSocial Networking Palm Reading Web Site ager, usability specialist, information architect, Web/interactive designer, programmer, and content editor. I experienced best practices for the creation of effective interfaces for the Jungyeon Yoon 02520599 Web by doing through(Jenny) the user-cenWeb Design & New Media tered note, design Please allprocess. critical text and art should appear within this gray area. Any content outside this area Academy of Art University may be unevenly trimmed or hidden when the book is bound. If you would like your artwork to extend August 04, 2010, 9:30AM to the very edge of your finished book, then pull your artwork edge to the red bleed line. First, development of the personal palmyour reading feature requiressimply high- use the downloaded Blurb PDF Export Preset (with no When design is complete, levels of programming. Using Webmodifications) to ensure your file is exported correctly. cams and photo uploading techthe Website makes use ofin an outside application (like Adobe Reader) to ensure it Benologies, sure to review your exported PDF photos of users’ palms for interpretaappears correctly and without these instructions. tion. I was immersed in the newest, most innovative technologies; HTML/ CSS, Java Script (Jquery), Flash Action Scripting, PHP/mySQL and Ajax.
Copyright Š 2010 Jungyeon (Jenny) Yoon. All rights reserved.
page 2
Table of Contents
Table of Contents Statement of Interest........................................ 4
Logo Development Version 2.......................... 30
Project Breakdown
Final UI........................................................... 32
Project Form/Type of Subject............................ 6
UI Development.............................................. 31
Technology Adopted......................................... 6
Launch + Testing
Competitive Analysis........................................ 7
Common Usage Scenarios.............................. 36
Target Audience............................................... 6 Comparative Matrix........................................ 15
Survey Analysis............................................... 16
Mindmap........................................................ 17
SSNiF.............................................................. 18 Main Features................................................. 19
Technical Component List.............................. 35
User Testing................................................... 40 User Testing Recommendations 1................... 41
User Testing Recommendations 2................... 42
User Testing Recommendations 3................... 43 User Testing Recommendations 4................... 44
Project Evolution
Conclusion
Workflow Sketch............................................. 23
Course History................................................ 47
Information Architecture................................. 22
Workflow........................................................ 24 Wireframes Version 1...................................... 25 Wireframes Version 2...................................... 26
Mood Board.................................................... 27 Palm Reader Character Development.............. 28
Logo Development Version 1.......................... 29
Project Conclusion.......................................... 46 Online Journal and Prototype Web site URLs.... 48
References . ................................................... 49
Acknowledgements ....................................... 52 About Author.................................................. 53
page 3
Statement of Interest
Statement of Interest It is fascinating to me that lots of psychic palm reading
Palmistry, one of the oldest of the insightful arts, is based
that we live in a highly sophisticated era. I believe this
the mental state of the entire body. It can help people to
services can be found in many cities despite the fact shows people’s desire to understand their lives and
their relationships. This inspired me to build an online
application that is entertaining and helps people better understand themselves and their relationships through palm reading.
page 4
on the belief that two palms reflect both the physical and
discover their hidden potentials and possibilities by looking at their palms. It is a tool of self-discovery, not a tool of
fortune telling. There are many different kinds of palmistry, but I condensed essential parts of each for the purpose of this project.
Project Breakdown
page 5
Project Breakdown
Project Form/Type of Subject
Target audience
u&iPalmReading is a palm reading Web site that is
Primary target audiences are from 18 to 25 year olds,
themselves and their relationships.
and spend a great deal of time on social networking Web
entertaining and helps people to better understand
Technology Adopted u&iPalmReading is accessible to everyone using a
moderately fast Internet connection who has the Adobe Flash 10.0+ plug-in installed.
It is compatible with Mac & PC, as well as the most common browsers.
The minimum required resolution is 1024x768 pixels for display on monitors.
page 6
primarily in North America, who love psychic related topics sites; enjoy self-test or psychic applications, use or are curious about online-dating Web sites.
Secondary target audiences are from 13 to 17 year olds
and from 26 to 34 year olds, primarily in North America,
who enjoy social network Web sites and self-test or psychic applications.
Project Breakdown
Competitive analysis : On-site Psychic Reading By Celia, 759 Ellis St, San Francisco, CA 94109, Phone: (415) 441-2773
Target audience Customers range in age from 20 – 65, 50% female, and 50% male. Price About $25-30 Strength In San Francisco, there are a lot of small places for psychic, palm or tarot card reading. These places definitely provide a full psychic experience, with private extra Q&A time costing around $25-30. Weaknesses Usually customers need to make an appointment. Unfortunately, many visitors feel uncertain about the results that they get from readers because such places are frequently questionable.
page 7
Project Breakdown
Competitive analysis : On-site research Palm reading places in San Francisco
page 8
Palm reading machines in San Francisco
Project Breakdown
Competitive analysis : Printed Media Palm Reading For Beginners: Find Your Future in the Palm of Your Hand (For Beginners). Webster, Richard. Llewellyn Publications (May 1, 2000)
Target audience Book audiences range in age from 16 – 57. 45% of the audiences are between 18-43 years of age. Price About $13 Strength In published books, contents are broken down into focused areas with details for serious audiences who want to know about palm reading. Weaknesses Since book readers are not professionals, they need to spend a great deal of time reading the book and may get confused because it is hard for them to know whether they interpreted the palm reading results correctly or not.
page 9
Project Breakdown
Competitive analysis : Printed Media Richard Webster said He discovered that palmistry is a wonderful way to meet girls. Most people will be thrilled to show you their hands. Palmistry is a wonderful way to make new friends. It will help you to understand other people’s motivations. You will be able to help many people by palm reading. Katina Z Jones said My grandmother was very adept at matching couples based on palm reading. Her skill was reading the lines on people’s hands to determine the perfect match. What are the frequently asked questions? Character, Love, Health, Career, Money
page 10
Project Breakdown
Competitive analysis : Online Application PalmDay.com, Read My Palm, <http://www.palmday.com/ read-my-palm.php>
Target audience
Users range in age from 18 - 55, more than 65% of whom are women. Price About $5 Strength It is relatively easy to use; shows clear steps through the test but does not necessarily show clear status in every step. It also has consistently organized choices for each step. Weaknesses There is no system for checking for errors. It provides a very unpleasant user experience; it doesnâ&#x20AC;&#x2122;t tell users up-front that they will have to pay, forcing them to pay right before giving their test results.
page 11
Project Breakdown
Competitive analysis : Online Application
page 12
Project Breakdown
Competitive analysis : Mobile Application iPalmReader- Palm Reading Simulator for the iPhone.
<http://www.icoolgeeks.com/apps/appPalmReader.htm>
Target audience Apple iPhone owners range in age from 18 - 35, more than 70% of whom are men. Price About $0.99 Strength It is a palm reading simulator for iPhone. It asks users to take a picture of their palms and then shows how they can be interpreted using visual guides for each major line. This approach is very good. Weaknesses The interpreting process is not functional. However, they donâ&#x20AC;&#x2122;t claim that this application is a real palm reader.
page 13
Project Breakdown
Competitive analysis : Mobile Application
page 14
Project Breakdown
Comparative matrix Online Application http://www.alloy.com
http://www.gurl.com
http://www.palmday.com
Mobile Application
New!
iPhone Application PalmReader
u&iPalmReading X
Experience without signup Personal palm reading
X
X
X
X
Invites
X
X
X
X
Relationship palm reading
X
Meet new people
X
Learn about palm reading
X
Save results
X
Free Technology
X
X
Flash
Java Script
X Java Script
Java
Flash, Java Script, Ajax
page 15
Project Breakdown
Survey analysis User Survey (March 5 2009)
Survey Demographic Info
32 Facebook users
March 5 2009
u&iPalmReading features Personal palm reading
20% Yes 50% Maybe 23% No Age 26-34
Age 13-17
Female
Age 18-25
Age 45-54
Male
50% 25%
17.5%
Compatibility palm reading with people I know
55%
17.5%
20% Yes 43% Maybe 36% No
25%
Compatibility palm reading with people I don’t know 16% Yes 43% Maybe 40% No
Survey Result Info March 5 2009
Learn about Palmistry
Favorite Features
100 80
7% Yes 40% Maybe 50% No
60 40 20
Maybe
Maybe Maybe
Yes
Personal palm reading
page 16
Yes
Compatibility palm reading with people I know
Yes
Compatibility palm reading with people I donʼt know
Maybe
Yes
Learn about Palmistry
Maybe
Yes
Virtual charm
Virtual charm feature
5% Yes 40% Maybe 55% No
Project Breakdown
Mindmap
page 17
Project Breakdown
SSNiF Stakeholder (User)
Situation
Needs
Feature/Solution
People who believe in palm readings
People often go to palm reading places but they want to get their palms read at their convenience.
Be able to get personal palm readings and relationship readings easily.
Online palm reading web application. Membership service to keep track of their palm readings. Invitation service for their friends. Notifications.
People who spend a lot on social networking sites
People who like online self/psychic related web applications
page 18
People who love to check out their relationship compatibility with their friends on their social networking sites for fun.
People enjoy online self/psychic web applications but they donʼt want to spend money on them.
A way to get closer to their friends via relationship palm readings. A way to meeting new interesting (not random) people or a way to start to talk to people that they were interested in.
Be able to satisfy their curiosity for themselves and their relationships by fun palm reading experiences for free.
Online palm reading web application. Invitation service for their friends. Providing suggested people for relationship palm reading. Notifications. Online palm reading web application.
Project Breakdown Main features
Research for features
1. Personality: Personal PalmReading
http://www.bjornborg.com/en/Missions/Loveforall/
Get a new understanding of your potential and find a deeper meaning in your life.
BreakUp/
2. Compatibility: Relationship PalmReading
Get insights into your relationships with people you care about.
3. Learn about palm reading: Palmistry Essentials
Be able to learn about basic palm reading knowledge
page 19
Project Breakdown Research for features http://www.vw.com/vwhype/babymaker/en/ us/?mId=29843399
page 20
Project Evolution
page 21
Project Evolution
Information Architecture
0.0 Home 5.0 About
1.0 Personality
2.0 Compatibility
3.0 Invites
7.0 Contact
6.0 Legal
4.0 Settings
page 22
1/1
Project Evolution
Work flow sketch Upload a picture using Web-cam
Take a photo of palms
How does a palm reading actually work?
Web-cam page
Anchor points
Process save
Prototype Verify
Confirm
Users 1
Store the photo/result
Display the result
Detection
2
Database
010101010000010101010100000 010101010000010101010100000 010101010000010101010100000 010101010000010101010100000 010101010000010101010100000 010101010000010101010100000 010101010000010101010100000 010101010000010101010100000 010101010000010101010100000 010101010000010101010100000 010101010000010101010100000 010101010000010101010100000 010101010000010101010100000 010101010000010101010100000
Upload a picture using a built-in uploading feature
Upload a photo of palms
+ -- < >
Uploading page
Verify
Confirm
Adjusting
Anchor points
Prototype
Alignment
Process save
3
Measurement
4
Representation
Store the photo/result
Display the result Database
Database
Users
5
Source Datamatch
Matching
6
Identification
page 23
Project Evolution
Workflow
0.0 Home 4.0 About
6.0 Contact
5.0 Legal
Log-in
2.0 Compatibility
1.0 Personality
MEMBER
1.2 Photo of palms
0.1 My home
2.1 Invites
1.3 Result
1.0 Personality
YES
2.0 Compatibility 1.1 My info
Sign-up
2.1 Invites
NO NO
GUEST
1.2 Photo of palms
1.3 Result
EXIT
Sign-up YES
3.0 Settings START OVER
1/1
page 24
Project Evolution
Wireframes version 1
Home
Personality step 1: info
Personality step 2: picture
Compatibility: profile lists
Compatibility: Results
Your home
Compatibility: My result lists
Message
page 25
Project Evolution
Wireframes version 2
Home
Personality step 1: info
Personality step 2: picture
Compatibility: profile lists
Compatibility: Results
Your home
Compatibility: My result lists
Message
page 26
Project Evolution
Mood board
page 27
Project Evolution
Palm reader character development
page 28
Project Evolution
Logo development version 1
page 29
Project Evolution
Logo development version 2
page 30
Project Evolution
UI development Version 1
Version 2
Version 3
page 31
Project Evolution
Final UI
Home
Personality step 1: info
Personality step 2: picture
Your home
Personality
Compatibility
page 32
Project Evolution
Personality step 2: picture
Personality step 3: results
Compatibility: invites
Compatibility: results
Settings
Palmistry Essentials
page 33
Launch + Testing
page 34
Launch + Testing
Technical component list Website application u&iPalmReading’s front-end application was developed with Adobe’s Flash (version CS4) and JavaScript. It relies on a back-end system with a MySQL database. The communication between both components is done with PHP. The application also makes use of the following: Flash Action Script 3.0 : com.adobe
Bitmap image capture (http://www.adobe.com/devnet/air/ajax/ quickstart/jpeg_file_upload.html) : com.greensock
Tween effect class (http://www.greensock.com/tweenmax/) : com.webdevils
Content manager (http://www.webdevils.com/) JavaScript : JavaScript-based PNG fix for Internet Explorer 5.5 and 6 on
Windows.
(http://homepage.ntlworld.com/bobosola/pnghowto.htm)
: jQuery JavaScript Library (http://jquery.com/) : jQuery plugin: Quick Pagination (http://projects.allmarkedup.com/jquery_quick_paginate/index. php) : jQuery plugin: Inline Dialog Box (http://onehackoranother.com/projects/jquery/boxy/) : jQuery plugin: Validation (http://bassistance.de/jquery-plugins/jquery-pluginvalidation/) HTML/CSS : CSS: YUI Grids customization (http://developer.yahoo.com/yui/grids/builder/) : 960 Grid System (http://960.gs/) : CSS: Scalable CSS Buttons (http://www.monc.se/kitchen/59/scalable-css-buttons-usingpng-and-background-colors/) PHP :Simple PHP-CAPTCHA (http://www.codewalkers.com/c/a/GUI-Code/SimplePHPCAPTCHA/)
page 35
Launch + Testing Common usage scenarios Use Case 1 Learn about palm reading & the site
Use Case 2 Get a palm reading for personality
Description: A user who does not know about palmistry visits the Web site for the first time and clicks the “About palm reading & the site” button before starting navigation
Description: A user signs up for the Web site and gets a personality palm reading by uploading the user’s photo.
Actors: A user, the System Additional Use Cases Needed: “Get a personality palm reading” Steps: 1. A user visits the “Home page” for the first time 2. A user clicks the “About palm reading & the site” button on the Home page 3. The System shows the “about palm reading & the site” pages; palmistry essentials that the Web site used (Additional use case)
page 36
Actors: A user, the System Additional Use Cases Needed: “Invite your friends” Steps: 1. A user locates the “Home page” 2. A user clicks the “sign up for FREE” button in the “Personality” box 3. A user fills out the information form and clicks the “Next step” button 4. The System gets the information and shows the next page 5. A user clicks the “Upload photo” button 6. The system opens a dialog box that allows the user to
Launch + Testing
select the photo to upload 7. A user selects a photo and clicks the “Next step” button 8. The System shows the user’s photo and an example photo with a tool asking the user to rotate and/or zoom to align their hands in the appropriate position in the image 9. A user adjusts the photo and clicks the “Next step” button 10. The System shows the user’s photo and the example photo with an anchor tool asking “Place anchors at the end of the user’s fingers and palms copying the example photo” 11. A user drags anchors to resemble the example photo to let the system recognize both palms and clicks the “Next step” button 12. The System shows the personality results (Additional use case)
Use Case 3 Invite people Description: A user invites people to get a palm reading for compatibility using the user’s email contacts for the first time Actors: A user, the System Additional Use Cases Needed: “Go to “My home” to check new compatibility palm reading results” Steps: 1. A new user signs up for the Web site after getting a personality result as a guest 2. The System shows the “Send invites” page 3. A user puts the user’s email address and password and clicks “Import contacts” 4. The System shows a list of people who are on the Web site
page 37
Launch + Testing
5. A user selects people and clicks the “Send request” button 6. The System shows a success message with the “see a list of people who are not on the Web site” buttons 7. A user clicks the “see a list of people who are not on the Web site” buttons 8. The System shows a list of people who are not on the Web site 9. A user selects people and clicks the “Send request” button 10. The System shows a success message with the “Send more invites” and the “Visit my home” buttons (Additional use case)
Use Case 4 Read compatibility palm reading results Description: A user sees a list of new compatibility palm reading results on the “My home” page Actors: A user, the System Additional Use Cases Needed: “Check out the other users’ personalities and their list of compatibility palm reading results” Steps: 1. A user logs in to the Web site 2. The System shows user’s “My Home” page 3. A user sees a list of new compatibility palm reading results on “My Home” 4. A user clicks one of the compatibility palm reading results to read (Additional use case)
page 38
Launch + Testing
Use Case 5 Check out the other users’ personalities and their list of compatibility palm reading results Description: A user sees other people’s personality palm reading results and their list of compatibility palm reading results Actors: A user, the System Steps: 1. A user logs in to the Web site 2. The System shows user’s “My Home” page 3. A user clicks “Compatibility” on the top navigation menu 4. The System shows the list of compatibility palm reading results 5. A user clicks one person from the list of users 6. The System shows the compatibility palm reading results for the user and the selected person 7. A user clicks the selected user’s username under the selected user’s photo 8. The System shows the selected user’s personality palm
reading results page 9. A user reads about the selected user’s personality palm reading results and sees the selected user’s list of compatibility palm reading results Additional Use Cases Needed: “Check out the other users’ personalities and their list of compatibility palm reading results” Steps: 1. A user logs in to the Web site 2. The System shows user’s “My Home” page 3. A user sees a list of new compatibility palm reading results on “My Home” 4. A user clicks one of the compatibility palm reading results to read (Additional use case)
page 39
Launch + Testing
User testing I used the usability lab and online chatting software for usability tests. Conducting formal usability tests at the lab was a great experience for me. It always surprised me with great finds. Formal usability tests Low-Fidelity Prototype Usability Testing: 2 High-Fidelity Prototype Usability Testing at the Usability lab: 3 Number of users: 20 (documented), plus many others undocumented Target users: 13 â&#x20AC;&#x201C; 60 year olds who enjoy social networking Web sites Recruiting method: My acquaintances at school
page 40
Core tasks Task #1. Get a personal palm reading. Task #2. After getting personality palm reading results, invite people for relationship palm readings. Task #3. Log in and check compatibility palm reading results. Task #4. Login and view other usersâ&#x20AC;&#x2122; personalities and their list of compatibility palm reading results. Request compatibility to one of them. Task #5. Learn about palmistry.
Launch + Testing
User testing Recommendations 1 Low-Fidelity Prototype Usability Testing (March 24, 2009) • Want
to see a palm reader character. many required steps needed for the palm reading. • Reconsider about using metaphor for labeling. • Show the summary of results effectively. (Kathleen, Alex, Yeun-jai, Hajung, Mike, Jeff) • Too
page 41
Launch + Testing
User testing Recommendations 2 High-Fidelity Prototype Usability Testing (May 5, 2009) • Need to focus on content presentation. • Work on info graphics to show results in the future. • “Surprise and delight” users (Peter)
page 42
Launch + Testing
User testing Recommendations 3 Low-Fidelity Prototype Usability Testing (March 24, 2010) â&#x20AC;˘ Need simpler info graphical guides. â&#x20AC;˘ Need easy workflow for compatibility. (Jay)
Home
Personality step 1: info
Personality step 2: picture
Personality step 3: results
Compatibility: invites
My home
Profile
Compatibility: Results
page 43
Launch + Testing
User testing Recommendations 4 4 High-Fidelity Prototype Usability Testing (May 12, 2010) • Web cam instruction needs to be shown up front. • Choosing dominant hand is a little unclear. • Invites email form is confusing because the input boxes for the email addresses and message content are the same size. • Refine visual designs and graphical elements. (Helen, Amy, Jade, Iris)
page 44
Launch + Testing
User testing Recommendations 5 5 High-Fidelity Prototype Usability Testing (July 12, 2010) â&#x20AC;˘ Personality
results: It needs to be organized. Try to remove unnecessary empty space. â&#x20AC;˘ Compatibility results: Tab/button designs need to be more noticeable. (Darold, Christine, Sarapol, Hyunkyung, DH, Mike, Chenchen)
Personality version1
Personality version2
Personality version3
Compatibility version1
Compatibility version2
Compatibility version3
page 45
Conclusion
page 46
Conclusion
Project conclusion My project is designed to reflect and improve my abilities
This works by putting together Flash ActionScript 3,
as a project manager, usability specialist, information
PHP, and a mySQL database, I was able to deepen my
content editor. I followed best practices for the creation of
systems.
architect, Web/interactive designer, programmer, and
effective interfaces for the Web by implementing the user-
understanding of coding for both front-end and back-end
centered design process.
I’d like to thank all the people in Web Design New Media
First, development of the personal palm reading feature
program. Without my director, Lourdes Livingston
requires high-levels of programming. Using Web-cams and photo uploading technologies, the Web site makes use of
photos of users’ palms for interpretation. I was immersed
department who have helped me throughout the entire
and other instructors, especially Kathleen Watson, Ryan
Medeiros and Jay Harley, I wouldn’t have achieved success.
in the newest, most innovative technologies: HTML/CSS,
I would like to exercise the knowledge that I gained from
Ajax.
the field.
Java Script (Jquery), Flash Action Scripting, PHP/mySQL and
Web design New Media at the Academy of Art University in
Second, after getting a personal palm reading, users will
I will keep creating intuitive Web sites that allow people to
palm reading. This part is a social networking feature. I
enjoy their lives.
invite people they like to the Web site for the relationship spent lots of time researching and testing for this to show
accomplish things effectively so they can have more time to
my capability as a Web user interface designer.
page 47
Conclusion
Course history 2007 Fall WNM 608 MS: Web Technology 1 WNM 606 MS: Principles of Usability GS 601 Aesthetics and the Renaissance 2008 Spring WNM 643 MS: Interactive Design & Concepts WNM 611 MS: Sound Specific WNM 619 MS: Advanced Digital Imaging GS 608 Professional Presentation and Communication Development 2008 Fall GS 610 Balancing Creativity and Profitability WNM 618 MS: Web Technology 2 WNM 612F MS: Scripting *10, 15, 2008 Midpoint Review 2009 Spring WNM 801 MS: Group Directed Study (User Experience) WNM 614 MS: Experimental Interactivity WNM 699 MS: Special Topics (Beyond Wired)
page 48
2009 Summer WNM 800 MS: Directed Study (Visual Design) 2009 Fall WNM 699 MS: Special Topics (Advanced Scripting) WNM 801 MS: Group Directed Study (Visual Design) WNM 800 MS: Directed Study (Web Technology) 2010 Spring
GS 604 Professional Practices and Communication
WNM 801 MS: Group Directed Study (User Experience) WNM 800 MS: Directed Study (Web Technology) 2010 Summer
WNM 900 MS: Internship (Gotomedia.com) *08, 04, 2010 Final Review
Conclusion
Online journal & prototype Web site URLs Before midpoint Prototype Web site: http://www.jennyinsf.com/scripting/final/ After midpoint 01 User Experience A Spring 2009 Online Journal: http://docs.google.com/View?id=dfqxfv8r_4cc9pmngn Prototype iPhone App: http://www.jennyinsf.com/bw/uipalmreaders/index.php Prototype Web site: http://www.jennyinsf.com/uipalmreading/ 02 Visual Design A Summer 2009 Online Journal: http://docs.google.com/View?id=dfqxfv8r_89gfzqzrgc
03 Visual Design B Fall 2009 Online Journal: http://docs.google.com/View?id=dfqxfv8r_93gm5dr2hq http://gds-vis-design-fa09.wikispaces.com/ Yoon%2C+Jenny http://gds-vis-design-fa09.wikispaces.com/ Yoon%2C+Jenny+2 04 Web Technology A Fall 2009 Online Journal: http://docs.google.com/View?id=dfqxfv8r_94dg542zgw 05 Web Technology B Spring 2010 Online Journal: http://docs.google.com/View?id=dfqxfv8r_103drn4fmdj 06 User Experience B Spring 2010 Online Journal: http://docs.google.com/View?id=dfqxfv8r_104dhbh77fp Web site: http://www.uandipalmreading.com/
page 49
Conclusion
References Book: Usability related Brinck, Tom, Gergle, Darren, Wood, Scott D.. Usability for the Web: Designing Web Sites that Work. San Francisco CA: Morgan Kaufmann, 2001. Print. Burdman, Jessica R. Collaborative Web Development: Strategies and Best Practices for Web Teams. Reading, Mass. Boston MA: Addison-Wesley, 1999. Print. Cooper, Alan. About Face 3: The Essentials of Interaction Design. Indianapolis, IN: Wiley Publication, Inc., 2007. Print. Friedlein, Ashley. Web Project Management: Delivering Successful Commercial Web Sites. San Francisco CA: Morgan Kaufmann, 2001. Print. Holmes, Nigel. Wordless Diagrams. New York NY: Bloomsbury, 2005. Print. Lynch, Patrick J., Horton, Sarah. Web Style Guide: Basic Design Principles for Creating Web Sites (2nd Edition). New Haven CT: Yale University Press, 2002. Print.
page 50
Nielsen, Jakob. Usability Engineering. San Francisco CA: Morgan Kaufmann, 1994. Print. Rubin, Jeffrey. Handbook of Usability Testing: How to Plan, Design, and Conduct Effective Tests. New York NY: John Wiley & Sons, Inc, 1994. Print. Saffer, Dan. Designing for Interaction. Berkeley CA: New Riders Press, 2009. Print. Siegel, David. Secrets of Successful Web Sites: Project Management on the World Wide Web. Indianapolis IN: Hayden Books, 1997. Print. Krug, Steve. Donâ&#x20AC;&#x2122;t Make Me Think! A Common Sense Approach to Web Usability (2nd Edition). Berkeley CA: New Riders Press, 2005. Print.
Conclusion
Book: Design related Holmes, Nigel. Wordless Diagrams. New York NY: Bloomsbury, 2005. Print.
Hazel, Peter. Palmistry Quick & Easy. Woodbury MN: Llewellyn Publications, 2001. Print.
Book: Code related
Jones, Katina Z.. The Everything Palmistry Book. Avon MA: Adams Media, 2003. Print.
Shupe, Rich, Rosser, Zevan,. Learning ActionScript 3.0. Sebastopol CA: O’Reilly Media, Inc., 2008. Print. Book: Palmistry related Domin, Linda. Instant Palm Reader: A Roadmap to Life. Woodbury MN: Llewellyn Publications, 2002. Print.
Levine, Roz. Palmistry: How to Chart the Lines of Your Life. New York NY: Fireside, 2002. Print. Webster, Richard. Palm Reading for Beginners. Woodbury MN: Llewellyn Publications, 2000. Print.
Fincham, Johnny. Palmistry: Apprentice to Pro in 24 Hours; The Easiest Palmistry Course Ever Written. Washington DC: O Books, 2007. Print. Gile, Robin. The Complete Idiot’s Guide to Palmistry. Indianapolis, IN: Alpha, 2005. Print.
page 51
Conclusion
Web: Design related
Web: Code related
Web Designer Wall : http://www.webdesignerwall.com/
Google Code : http://code.google.com
Make Better Websites : http://www.makebetterwebsites.com/
Adobe Flash ActionScript 3.0 : http://help.adobe.com/en_US/
UX Booth: http://www.uxbooth.com/
ActionScript/3.0_ ProgrammingAS3/
Six Revisions : http://sixrevisions.com/
Tween Max : http://blog.greensock.com
Vandelay Design Blog :http://vandelaydesign.com/blog/
Webdevils : http://www.webdevils.com
Fuel Your Interface : http://www.fuelyourinterface.com/
gotoAndLearn : http://www.gotoandlearn.com
Noupe : http://www.noupe.com/
W3Schools : http://www.w3schools.com/
Smashing Magazine : http://www.smashingmagazine.com/ Inspired Magazine : http://www.inspiredm.com/ Web Design Ledger : http://webdesignledger.com/ MindMeister : http://www.mindmeister.com/ BjornBorg : http://www.bjornborg.com/ VW Routan : http://www.vw.com/routan/en/us/
page 52
jQuery : http://jquery.com/
Conclusion
Acknowledgements I would like to thank the following people for their support, encouragement and inspiration. My Wonderful Director Lourdes Livingston User Experience Kathleen Watson Alexander Pineda Visual Design Michael Brunsfeld Ryan Medeiros Web Technology Jay Harley Felicia Chamberlain Flash Mitchell Hudson Ed Salvana Timothy Jordan Erland Sanborn
Palmistry Kelly Goto Sidharth Oomman Special thanks for your help Abhishek Nimbalkar, Ann Yoon, Academy of Art, Boonchanin Siripattanasarakit, Bryan Cheng, Byung Gyu Ahn, Candy Guo, Cesar Rodriguez, Chenchen Liu, Christin Hwang, D.h. Shin, Daniel Kleven, Darold Davis, David H. Shen, Do Young Ahn, Eddie Shieh, Ellie Cho, Eric Bauer, Erik L. Richardson, Erin Chiang, Eunyong Ryu, Hajung Kim, Hyunkyung Joo, HyunSun Jung, Iris Yang, Jade Liang, Jiyoung Son, Jongwoo Lee, Jun Xu, Kalar Su, Mary Wharmby, Mason Shin, Peter Urfer, Raul Gonzalez, Rutu Warade Upadhyaya, Sidharth Oomman, Sigit Jioe, Skip Allums, Sol Huh, Sunju Lee, Tanner Roo, Tomonari Ito, Wenjie Xu, Whitney Wilson, Wom Ification, Yeunjai Lee And lastly but most importantly, Chris Moore
page 53
About Author
Author’s autobiography
Author’s resume
Jenny Yoon is an aspiring interaction designer who is passionate about creating intuitive Web experiences for users.
Jenny Yoon Web/User Interface Designer
Her artistic interests began with drawing, which developed into a focus in Web Design. She studied Visual Information Design, a combination of graphic and multimedia design at Ewha Womans’ University in Korea and attended Parsons School for Design in New York as an international exchange student. Ewha Womans’ University and Parsons taught her considerable approaches to design as well as the importance of understanding the basics of design. In 2004, She began to work as a Web designer; thus her career developed to include work as a graphic designer, HTML/CSS coder, and Flash designer. In 2007, she continued her education and major in Web design New Media MFA at the Academy of Art University in San Francisco. She has numerous art works selected for the Spring Show, and receiving Digital Imaging awards for 08 Spring Show. She was also mentioned on President’s honor list in 07 Fall, 08 Fall and 09 Fall.
page 54
Contact San Francisco, CA 94115 yeonyyoon@gmail.com Portfolio http://www.jennyinsf.com/ Work experience
Skills Photoshop Illustrator InDesign Flash (AS3) XHTML/CSS Jquery PHP/mySQL (Basic)
Freelance interaction designer | 2/10 – PRESENT Gotomedia LLC, design firm, San Francisco, CA, U.S.A. Worked on Web, user interface, and Flash designs for several projects Student volunteer | 6/22/09 - 6/27/09 http://www.nngroup.com/ Nielsen Norman Group, Usability week 2009, San Francisco, CA, U.S.A. Assist speakers during the conference Internship | 2/08 - 8/08 http://www.asab.com/ Ashton Abeck, design firm, San Francisco, CA, U.S.A. Designed Web page layouts, developed Flash designs, and coded Web sites in HTML/CSS Junior Web/user interface designer | 6/04-3/06 http://www.joins.com/ Joongangilbo New Media Inc., Seoul, South Korea Developed and maintained Web sites with senior designers and programmers
About Author
Internship | 2/04-4/04 http://www.9Fruits.com/ 9 Fruits Media, online campaign company, Seoul, South Korea Designed e-mail marketing pages and banners under weekly and monthly deadlines
Honors and scholarships
Internship | 6/03-10/03 Sharp Gallery, New York, New York, U.S.A. Edited gallery events in New York for e-mail service of gallery, visited artists’ studios, and interviewed various artists
President’s honor list
Group exhibition | 5/02 Ewha Woman’s University e-media art festival, Music video depart, Crush, Seoul, South Korea Created a music video with one other team member Group exhibition | 2/01 Duk-Won Gallery Fly like a butterfly, show like a bee, installation art, Poisoning, Seoul, South Korea Created an art piece for an anti-drug campaign with one other artist
Academy of Art University spring show 2008
First place and second place in Illusion category of Digital Imaging Second place in Conceptual category of Digital Imaging
Academy of Art University fall 2007, fall 2008, fall 2009
Korea Communications Commission Scholarship | 1/03 - 7/03 Parsons School of Design, New York, U.S.A.
Education Master of Fine Art | 9/07 - 8/10 http://www.academyart.edu/ Academy of Art University, San Francisco, U.S.A. MAJOR: Web Design & New Media
Exchange program | 1/03 - 7/03 http://cdt.parsons.edu/ Parsons School of Design, New York, U.S.A.
MAJOR: Design & technology
Bachelor of Fine Arts | 1/99 - 8/03 http://artndesign.ewha.ac.kr/Ewha Woman’s University, Seoul, South Korea MAJOR: Visual information design
page 55
u&iPalmReading
http://www.uandipalmreading.com/
Thank you for reading. Jenny
page 56
Copyright Š 2010 Jungyeon (Jenny) Yoon. All rights reserved.