Websites/Mozilla.org/One Mozilla/Documentation/Checklist-UX - Revision history

Ckoehler: moved One-Mozilla-Project/Documentation/Checklist-UX to Websites/Mozilla.org/One Mozilla/Documentation/Checklist-UX: Re-organizing and bringing up to date all Mozilla.org website documentation.

2012-08-07T19:41:53Z

moved One-Mozilla-Project/Documentation/Checklist-UX to Websites/Mozilla.org/One Mozilla/Documentation/Checklist-UX: Re-organizing and bringing up to date all Mozilla.org website documentation.

← Older revision	Revision as of 19:41, 7 August 2012
(No difference)

Firepug: Blanked the page

2012-03-22T17:48:54Z

Blanked the page

Show changes

Firepug at 16:30, 13 March 2012

2012-03-13T16:30:02Z

← Older revision		Revision as of 16:30, 13 March 2012
Line 1:		Line 1:
			''originally published by [https://wiki.mozilla.org/Chrissiebrodigan cbrodigan,] Feb 2012''

	=Pre-Launch=		=Pre-Launch=

Firepug at 05:23, 21 February 2012

2012-02-21T05:23:14Z

← Older revision		Revision as of 05:23, 21 February 2012
Line 196:		Line 196:
	*''Small design & copy change:'' [https://bugzilla.mozilla.org/show_bug.cgi?id=722856 Bug 722856] is working to solve that with revised ux, new messaging & a new page title More on this challenge on [https://bugzilla.mozilla.org/show_bug.cgi?id=722848 Tracking Bug 722848]		*''Small design & copy change:'' [https://bugzilla.mozilla.org/show_bug.cgi?id=722856 Bug 722856] is working to solve that with revised ux, new messaging & a new page title More on this challenge on [https://bugzilla.mozilla.org/show_bug.cgi?id=722848 Tracking Bug 722848]
	*''Measurement:'' Coming soon!		*''Measurement:'' Coming soon!

			=Recommended Reading=

Firepug: /* Choose an Area to Improve */

2012-02-21T02:05:20Z

Choose an Area to Improve

← Older revision		Revision as of 02:05, 21 February 2012
Line 183:		Line 183:
	*Specify where & what your are you? (this could be as simple as having the wrong snippet of copy showing up in Google results or as complex as having removed a critical download button)		*Specify where & what your are you? (this could be as simple as having the wrong snippet of copy showing up in Google results or as complex as having removed a critical download button)

	~~Action Items~~:		''Tips:''
	*~~Make small~~ design and copy changes		*Small design and copy changes can have a large impact
	*Measure change and compare it to the baseline		*Measure change and compare it to the baseline

Line 191:		Line 191:
	At the time I'm writing this, the /firefox site is leaking a lot of 3.6 content and creating a conflicting experience around downloading the latest Firefox v. 3.6. "3.6" is the 10th most popular keyword that brings users to the website.		At the time I'm writing this, the /firefox site is leaking a lot of 3.6 content and creating a conflicting experience around downloading the latest Firefox v. 3.6. "3.6" is the 10th most popular keyword that brings users to the website.

	''Challenge:'' We still support 3.6, but we are urging users towards the latest build.		*''Challenge:'' We still support 3.6, but we are urging users towards the latest build.
			*''Baseline:'' Page views & 3.6 download numbers
	''Baseline:'' Page views & 3.6 download numbers		*''Leaks:'' Take a look at how users are seeing our active 3.6 support in Google searches for the keyword "Firefox" [http://www.diigo.com/item/image/1981d/u78p here]
			*''Small design & copy change:'' [https://bugzilla.mozilla.org/show_bug.cgi?id=722856 Bug 722856] is working to solve that with revised ux, new messaging & a new page title More on this challenge on [https://bugzilla.mozilla.org/show_bug.cgi?id=722848 Tracking Bug 722848]
	''Leaks:'' Take a look at how users are seeing our active 3.6 support in Google searches for the keyword "Firefox" [http://www.diigo.com/item/image/1981d/u78p here]		*''Measurement:'' Coming soon!

	''Small design & copy change:'' [https://bugzilla.mozilla.org/show_bug.cgi?id=722856 Bug 722856] is working to solve that with revised ux, new messaging & a new page title More on this challenge on [https://bugzilla.mozilla.org/show_bug.cgi?id=722848 Tracking Bug 722848]

	''Measurement:'' Coming soon!

Firepug: /* Choose an Area to Improve */

2012-02-21T02:04:04Z

Choose an Area to Improve

← Older revision		Revision as of 02:04, 21 February 2012
Line 177:		Line 177:
	Even the best website, web page, and application has leaks. Post-launch, starting with one area will help target your efforts and move the needle. For instance, if you're trying to increase downloads of the latest Firefox, don't expand the scope to include an analysis of how to improve social sharing. Keep it simple, focused.		Even the best website, web page, and application has leaks. Post-launch, starting with one area will help target your efforts and move the needle. For instance, if you're trying to increase downloads of the latest Firefox, don't expand the scope to include an analysis of how to improve social sharing. Keep it simple, focused.

	'''Checklist:'''		''Checklist:''
	<br>		<br>
	*~~What is the~~ baseline? (state of your current data)		*Record a baseline (state of your current data)
	*~~What~~ layer of the funnel ~~can~~ you improve ~~easily?~~		*Determine which layer of the funnel you want to improve
	*~~Where are the leaks~~ & what are you ~~leaking~~? (this could be as simple as having the wrong snippet in Google results)		*Specify where & what your are you? (this could be as simple as having the wrong snippet of copy showing up in Google results or as complex as having removed a critical download button)

	Action Items:		Action Items:
Line 187:		Line 187:
	*Measure change and compare it to the baseline		*Measure change and compare it to the baseline

	'''Example: ~~Firefox~~ Site & 3.6 Downloads'''		'''Example: /firefox Product Site & the Case of 3.6 Downloads'''
	<br>		<br>
	At the time I'm writing this, the /firefox site is leaking a lot of 3.6 content and creating a conflicting experience around downloading the latest Firefox v. 3.6. "3.6" is the 10th most popular keyword that brings users to the website.		At the time I'm writing this, the /firefox site is leaking a lot of 3.6 content and creating a conflicting experience around downloading the latest Firefox v. 3.6. "3.6" is the 10th most popular keyword that brings users to the website.

Firepug: /* Audit for Drop-off */

2012-02-21T02:01:30Z

Audit for Drop-off

← Older revision		Revision as of 02:01, 21 February 2012
Line 170:		Line 170:
	*Recurring use (this is where we engage users from What's New & First Run pages)		*Recurring use (this is where we engage users from What's New & First Run pages)

	~~'''Example: /firefox Product Site'''~~
	~~<br>~~
	When a user arrives at the top of one of our major download funnels we attempt to learn why she doesn't download and bounces from the experience.		When a user arrives at the top of one of our major download funnels we attempt to learn why she doesn't download and bounces from the experience.

Firepug: /* Accessibility */

2012-02-21T02:00:26Z

Accessibility

← Older revision		Revision as of 02:00, 21 February 2012
Line 91:		Line 91:
	*Is intuitive alt-text present on all images and media files?		*Is intuitive alt-text present on all images and media files?

	Tips:		''Tips:''
	*Group related sub-points and sub-navigation links into lists		*Group related sub-points and sub-navigation links into lists
	*Front-load links into sentences		*Front-load links into sentences

Firepug: /* Map the User Flow */

2012-02-21T01:59:56Z

Map the User Flow

← Older revision		Revision as of 01:59, 21 February 2012
Line 63:		Line 63:
	All users come to a website, web page, or inside of an app experience from somewhere. Mapping the user flow before implementation helps the copywriter, designer, and developer understand the different ways in which users will find this information.		All users come to a website, web page, or inside of an app experience from somewhere. Mapping the user flow before implementation helps the copywriter, designer, and developer understand the different ways in which users will find this information.

	''~~Some Examples:~~''		''Places users come from''
	*Organic keyword search/SEO (how Google organizes your website's information)		*Organic keyword search/SEO (how Google organizes your website's information)
	*Clicking from a static element:		*Clicking from a static element:

Firepug at 01:58, 21 February 2012

2012-02-21T01:58:57Z

← Older revision		Revision as of 01:58, 21 February 2012
Line 2:		Line 2:

	==Create Personas==		==Create Personas==
	Personas will help you design an experience with an audience's attitudes and motivations in mind. They can be complex or informal, depending on your needs.		''Personas'' will help you design an experience with an audience's attitudes and motivations in mind. They can be complex or informal, depending on your needs.
	<br>		<br>

Line 25:		Line 25:
	*Firefox Nightly - ultra-technical user		*Firefox Nightly - ultra-technical user
	<br>		<br>
	Adam "WebDev" Parker		''Adam "WebDev" Parker''
	*Used Firefox for years, but currently uses Chrome for its speed and developer tools		*Used Firefox for years, but currently uses Chrome for its speed and developer tools
	*Loves speed more than anything else when it comes to browsers		*Loves speed more than anything else when it comes to browsers
Line 41:		Line 41:

	==Build Use Cases==		==Build Use Cases==
	Use case is ~~another~~ word for story. These are the stories that provide context for the copywriter, designer, and developer who are working with you on your site.		''Use case'' is a fancy word for story. These are the stories that provide context for the copywriter, designer, and developer who are working with you on your site.

	You can write use cases very easily, answering the following questions:		You can write use cases very easily, answering the following questions:
Line 51:		Line 51:
	'''Example: /firefox Product Site'''		'''Example: /firefox Product Site'''
	<br>		<br>
	V1-Simple:		''V1-Simple:''
	*The user should be able to download Firefox within 30 seconds.		*The user should be able to download Firefox within 30 seconds.

	V2-Complex:		''V2-Complex:''
	*The user would like to learn more about how Firefox uses geolocation.		*The user would like to learn more about how Firefox uses geolocation.
	*She should locate the /features page, read the description on how Firefox uses geolocation, understand it, and then be compelled to download Firefox."		*She should locate the /features page, read the description on how Firefox uses geolocation, understand it, and then be compelled to download Firefox."

	Note: The second example is broader and more exploratory, where success can be more difficult to measure. A broad user goal can be useful in identifying areas in which to do further examinations.		''Note:'' The second example is broader and more exploratory, where success can be more difficult to measure. A broad user goal can be useful in identifying areas in which to do further examinations.

	==Map the User Flow==		==Map the User Flow==
	All users come to a website, web page, or inside of an app experience from somewhere. Mapping the user flow before implementation helps the copywriter, designer, and developer understand the different ways in which users will find this information.		All users come to a website, web page, or inside of an app experience from somewhere. Mapping the user flow before implementation helps the copywriter, designer, and developer understand the different ways in which users will find this information.

	Some Examples:		''Some Examples:''
	*Organic keyword search/SEO (how Google organizes your website's information)		*Organic keyword search/SEO (how Google organizes your website's information)
	*Clicking from a static element:		*Clicking from a static element:
Line 72:		Line 72:
	(those are just a few of many!)		(those are just a few of many!)

	Checklist:		''Checklist:''
	*Do you want your product discoverable by search engines like Google? (if yes, read [https://wiki.mozilla.org/One-Mozilla-Project/Documentation/Checklist-SEO SEO checklist])		*Do you want your product discoverable by search engines like Google? (if yes, read [https://wiki.mozilla.org/One-Mozilla-Project/Documentation/Checklist-SEO SEO checklist])
	*Are users who share a link to your product, sharing the best "snippet"? (if yes, read [https://wiki.mozilla.org/One-Mozilla-Project/Documentation/Checklist-SEO SEO checklist])		*Are users who share a link to your product, sharing the best "snippet"? (if yes, read [https://wiki.mozilla.org/One-Mozilla-Project/Documentation/Checklist-SEO SEO checklist])
Line 85:		Line 85:
	*users who have difficulty processing text (e.g. users with a cognitive disability)		*users who have difficulty processing text (e.g. users with a cognitive disability)

	Checklist:		''Checklist:''
	*Is text easily re-sized?		*Is text easily re-sized?
	*Have you included keyboard shortcuts?		*Have you included keyboard shortcuts?
Line 118:		Line 118:
	There are times for sharing and times for withholding just a little bit for a better time. For example, if there's a blog post, moving the share closer to the end of the article (or having it in multiple places) can be helpful, because someone just finishing an article is likely more motivated to share what she's just finished reading.		There are times for sharing and times for withholding just a little bit for a better time. For example, if there's a blog post, moving the share closer to the end of the article (or having it in multiple places) can be helpful, because someone just finishing an article is likely more motivated to share what she's just finished reading.
	<br>		<br>
	*'''Immediate sharing''' is designed largely for editorial content, especially a thought-provoking article, fabulous slideshow, laugh-out-loud video		*''Immediate sharing'' is designed largely for editorial content, especially a thought-provoking article, fabulous slideshow, laugh-out-loud video
	*'''Interval sharing''' is designed largely for user flows, after the user completes the primary goal. While not immediate, it can actually be more fulfilling for the sharer.		*''Interval sharing'' is designed largely for user flows, after the user completes the primary goal. While not immediate, it can actually be more fulfilling for the sharer.

	'''Example: Foursquare'''		'''Example: Foursquare'''
Line 193:		Line 193:
	At the time I'm writing this, the /firefox site is leaking a lot of 3.6 content and creating a conflicting experience around downloading the latest Firefox v. 3.6. "3.6" is the 10th most popular keyword that brings users to the website.		At the time I'm writing this, the /firefox site is leaking a lot of 3.6 content and creating a conflicting experience around downloading the latest Firefox v. 3.6. "3.6" is the 10th most popular keyword that brings users to the website.

	'''Challenge:''' We still support 3.6, but we are urging users towards the latest build.		''Challenge:'' We still support 3.6, but we are urging users towards the latest build.

	'''Baseline:''' Page views & 3.6 download numbers		''Baseline:'' Page views & 3.6 download numbers

	'''Leaks:''' Take a look at how users are seeing our active 3.6 support in Google searches for the keyword "Firefox" [http://www.diigo.com/item/image/1981d/u78p here]		''Leaks:'' Take a look at how users are seeing our active 3.6 support in Google searches for the keyword "Firefox" [http://www.diigo.com/item/image/1981d/u78p here]

	'''Small design & copy change:''' [https://bugzilla.mozilla.org/show_bug.cgi?id=722856 Bug 722856] is working to solve that with revised ux, new messaging & a new page title More on this challenge on [https://bugzilla.mozilla.org/show_bug.cgi?id=722848 Tracking Bug 722848]		''Small design & copy change:'' [https://bugzilla.mozilla.org/show_bug.cgi?id=722856 Bug 722856] is working to solve that with revised ux, new messaging & a new page title More on this challenge on [https://bugzilla.mozilla.org/show_bug.cgi?id=722848 Tracking Bug 722848]

	'''Measurement:''' Coming soon!		''Measurement:'' Coming soon!