User-centric Development in the Early Days of jQuery
-
Upload
jeresig -
Category
Technology
-
view
65 -
download
0
Transcript of User-centric Development in the Early Days of jQuery
![Page 1: User-centric Development in the Early Days of jQuery](https://reader030.fdocuments.us/reader030/viewer/2022032619/55bdab3ebb61eb7c5d8b4644/html5/thumbnails/1.jpg)
User-centric Development in the Early Days of jQuery
John Resig
![Page 2: User-centric Development in the Early Days of jQuery](https://reader030.fdocuments.us/reader030/viewer/2022032619/55bdab3ebb61eb7c5d8b4644/html5/thumbnails/2.jpg)
Early JS Libraries
• in 2004-2009 the market was very saturated
• Dojo Toolkit, Prototype, MochiKit, YUI, MooTools, jQuery
• All scratched similar itches (simplifying DOM manipulation)
![Page 3: User-centric Development in the Early Days of jQuery](https://reader030.fdocuments.us/reader030/viewer/2022032619/55bdab3ebb61eb7c5d8b4644/html5/thumbnails/3.jpg)
Assume All Code is Equal…
• Given that all the code is “good enough”
• How do you differentiate a library?
• You focus on all the things that “aren’t code”
• Most of these are user-centric and require intimate knowledge of how the user will use your framework
![Page 4: User-centric Development in the Early Days of jQuery](https://reader030.fdocuments.us/reader030/viewer/2022032619/55bdab3ebb61eb7c5d8b4644/html5/thumbnails/4.jpg)
You are your own worst enemy
• Virtually every time someone stops using your library it’s your own fault
• Something was not communicated clearly enough
• You had bugs that the user couldn’t overcome
• There were issues that the user didn’t understand and couldn’t find a good answer to
![Page 5: User-centric Development in the Early Days of jQuery](https://reader030.fdocuments.us/reader030/viewer/2022032619/55bdab3ebb61eb7c5d8b4644/html5/thumbnails/5.jpg)
What it all boils down to…
• Can you help your users overcome the initial hurdles they overcome - and are you giving them room, and the resources, to grow?
• Put yourself in your user’s shoes — empathize with them!
![Page 6: User-centric Development in the Early Days of jQuery](https://reader030.fdocuments.us/reader030/viewer/2022032619/55bdab3ebb61eb7c5d8b4644/html5/thumbnails/6.jpg)
The First Day: Can this help me?Hom
epag
e
View Tu
toria
l
Downlo
ad
Try T
utor
ial
Expe
rimen
t
The First Month: Learning
Integ
ratio
n
API Doc
s
Tuto
rials
Expe
rimen
t
Commun
ityThe First Year: Growth
Seco
nd A
pp
Explo
re A
PI
Exte
nd A
PI
Read S
ource
Contri
bute
![Page 7: User-centric Development in the Early Days of jQuery](https://reader030.fdocuments.us/reader030/viewer/2022032619/55bdab3ebb61eb7c5d8b4644/html5/thumbnails/7.jpg)
The First Day: Can this help me?Hom
epag
e
View Tu
toria
l
Downlo
ad
Try T
utor
ial
Expe
rimen
t
The First Month: Learning
Integ
ratio
n
API Doc
s
Tuto
rials
Expe
rimen
t
Commun
ityThe First Year: Growth
Seco
nd A
pp
Explo
re A
PI
Exte
nd A
PI
Read S
ource
Contri
bute
![Page 8: User-centric Development in the Early Days of jQuery](https://reader030.fdocuments.us/reader030/viewer/2022032619/55bdab3ebb61eb7c5d8b4644/html5/thumbnails/8.jpg)
Lack of Empathy -> AttritionFailure at any step costs your project another user.
Your project is your own worst enemy.
![Page 9: User-centric Development in the Early Days of jQuery](https://reader030.fdocuments.us/reader030/viewer/2022032619/55bdab3ebb61eb7c5d8b4644/html5/thumbnails/9.jpg)
The First Day“After spending less than 3 hours reading blog posts and perusing the documentation I was able to do a lot more in a lot less time then ever
before. The huge community and neatly organized jQuery plugins make me feel like a sucker for not having jQuery for my pet-project.”
http://aleembawany.com/2009/01/16/switching-from-prototype-to-jquery/
![Page 10: User-centric Development in the Early Days of jQuery](https://reader030.fdocuments.us/reader030/viewer/2022032619/55bdab3ebb61eb7c5d8b4644/html5/thumbnails/10.jpg)
Homepage
• Set a good first impression
• Answer the questions:
• What is this?
• What can it do for me?
• Where can I go to learn more?
![Page 11: User-centric Development in the Early Days of jQuery](https://reader030.fdocuments.us/reader030/viewer/2022032619/55bdab3ebb61eb7c5d8b4644/html5/thumbnails/11.jpg)
![Page 12: User-centric Development in the Early Days of jQuery](https://reader030.fdocuments.us/reader030/viewer/2022032619/55bdab3ebb61eb7c5d8b4644/html5/thumbnails/12.jpg)
![Page 13: User-centric Development in the Early Days of jQuery](https://reader030.fdocuments.us/reader030/viewer/2022032619/55bdab3ebb61eb7c5d8b4644/html5/thumbnails/13.jpg)
Download• Make it super-easy, remove any barriers
• (We link straight to the source, no .zip)
![Page 14: User-centric Development in the Early Days of jQuery](https://reader030.fdocuments.us/reader030/viewer/2022032619/55bdab3ebb61eb7c5d8b4644/html5/thumbnails/14.jpg)
Licensing• Not a concern for more people
• A huge concern for a lot of corporate users
• Use the most-open license possible
• Fewest number of restrictions gives you the largest possible market
• We us the MIT license for jQuery
• “Leave my name on the source file”
![Page 15: User-centric Development in the Early Days of jQuery](https://reader030.fdocuments.us/reader030/viewer/2022032619/55bdab3ebb61eb7c5d8b4644/html5/thumbnails/15.jpg)
Getting Started Tutorial• Clear, focused
• Assume no background knowledge
![Page 16: User-centric Development in the Early Days of jQuery](https://reader030.fdocuments.us/reader030/viewer/2022032619/55bdab3ebb61eb7c5d8b4644/html5/thumbnails/16.jpg)
Try the Tutorial• …and subsequent experimentation
• All about code quality
• For JavaScript libraries: Make sure your code is seamless across browsers
• For desktop apps: Is it truly cross-platform? Are there dependencies?
• The user should never be forced to ask for help in order to get started
• Asking for help “getting started” is a failure case on your end
![Page 17: User-centric Development in the Early Days of jQuery](https://reader030.fdocuments.us/reader030/viewer/2022032619/55bdab3ebb61eb7c5d8b4644/html5/thumbnails/17.jpg)
Simplicity in API Design
• Simple APIs are king
• Users understand quicker
• Get started faster
• Become advanced quicker
![Page 18: User-centric Development in the Early Days of jQuery](https://reader030.fdocuments.us/reader030/viewer/2022032619/55bdab3ebb61eb7c5d8b4644/html5/thumbnails/18.jpg)
The First Month“Alright I am now really really into jQuery. I used to hate javascript. WHAT HAS HAPPENED HERE? Javascript
people, speak to me.”
http://twitter.com/_ralph/status/1123503553
![Page 19: User-centric Development in the Early Days of jQuery](https://reader030.fdocuments.us/reader030/viewer/2022032619/55bdab3ebb61eb7c5d8b4644/html5/thumbnails/19.jpg)
Community Resources
• Provides places for users to ask questions
• jQuery:
• Mailing list -> Forum
• IRC Channel
• External:
• Stack Overflow
• Blogs
![Page 20: User-centric Development in the Early Days of jQuery](https://reader030.fdocuments.us/reader030/viewer/2022032619/55bdab3ebb61eb7c5d8b4644/html5/thumbnails/20.jpg)
Monitor Your Community
• Make sure that everyone is getting the help that they need
• Evangelism Team, was run by Rey Bango
• Track all of the services they use
• Mailing lists, IRC, Blogs, Twitter
![Page 21: User-centric Development in the Early Days of jQuery](https://reader030.fdocuments.us/reader030/viewer/2022032619/55bdab3ebb61eb7c5d8b4644/html5/thumbnails/21.jpg)
ServiceTreat every user as a potential, future, contributor.
![Page 22: User-centric Development in the Early Days of jQuery](https://reader030.fdocuments.us/reader030/viewer/2022032619/55bdab3ebb61eb7c5d8b4644/html5/thumbnails/22.jpg)
Service
• Mike Alsup and Michael Geary both became long-time contributors!
![Page 23: User-centric Development in the Early Days of jQuery](https://reader030.fdocuments.us/reader030/viewer/2022032619/55bdab3ebb61eb7c5d8b4644/html5/thumbnails/23.jpg)
Tracking Twitter• Track people talking about the code
• Look for people having trouble, asking questions
![Page 24: User-centric Development in the Early Days of jQuery](https://reader030.fdocuments.us/reader030/viewer/2022032619/55bdab3ebb61eb7c5d8b4644/html5/thumbnails/24.jpg)
Answer Questions• It takes a lot of time but sometimes it’s not worth it
• You never know you could be having trouble
![Page 25: User-centric Development in the Early Days of jQuery](https://reader030.fdocuments.us/reader030/viewer/2022032619/55bdab3ebb61eb7c5d8b4644/html5/thumbnails/25.jpg)
Follow-up with Large Users
• Maintain a list of contacts with your large users
• Ping them every once in a while
• Make sure that they’re having a good experience
• They frequently forget to file a bugs - make sure that happens
![Page 26: User-centric Development in the Early Days of jQuery](https://reader030.fdocuments.us/reader030/viewer/2022032619/55bdab3ebb61eb7c5d8b4644/html5/thumbnails/26.jpg)
API Documentation
• jQuery had API docs from the start (2006)
• Two other major libraries: Dojo, Prototype didn’t have any official docs until 2007
• Clarity and usability of documentation is huge
![Page 27: User-centric Development in the Early Days of jQuery](https://reader030.fdocuments.us/reader030/viewer/2022032619/55bdab3ebb61eb7c5d8b4644/html5/thumbnails/27.jpg)
API Example
![Page 28: User-centric Development in the Early Days of jQuery](https://reader030.fdocuments.us/reader030/viewer/2022032619/55bdab3ebb61eb7c5d8b4644/html5/thumbnails/28.jpg)
Alternative Views
![Page 29: User-centric Development in the Early Days of jQuery](https://reader030.fdocuments.us/reader030/viewer/2022032619/55bdab3ebb61eb7c5d8b4644/html5/thumbnails/29.jpg)
Learn More
• Tutorials and books
• Tutorials are short and drive home a point or single topic
• “Books” are more holistic and lead the reader from start to finish
![Page 30: User-centric Development in the Early Days of jQuery](https://reader030.fdocuments.us/reader030/viewer/2022032619/55bdab3ebb61eb7c5d8b4644/html5/thumbnails/30.jpg)
Tutorials
![Page 31: User-centric Development in the Early Days of jQuery](https://reader030.fdocuments.us/reader030/viewer/2022032619/55bdab3ebb61eb7c5d8b4644/html5/thumbnails/31.jpg)
Other “Secondary” Concerns When Coding
Responsive Design
Internationalization
Accessibility
Performance/Bandwidth
![Page 32: User-centric Development in the Early Days of jQuery](https://reader030.fdocuments.us/reader030/viewer/2022032619/55bdab3ebb61eb7c5d8b4644/html5/thumbnails/32.jpg)
Release Timing
![Page 33: User-centric Development in the Early Days of jQuery](https://reader030.fdocuments.us/reader030/viewer/2022032619/55bdab3ebb61eb7c5d8b4644/html5/thumbnails/33.jpg)
Overview• Help your users at every step of the way
• Track them and help the stragglers
• Help them grow and flourish
• Questions?
• http://ejohn.org/
• http://twitter.com/jeresig