Widget 101


Published on

Brief overview of widgets, description of Attendio widget, and first-cut design of a new widget for advocacy.

Published in: Technology, Design
1 Comment
No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

Widget 101

  1. 1. Widgets 101 1. Analysis of Attendio Widget 2. Fun in design: an advocacyWidget Ralph Sklarew, principal workingWidgets
  2. 2. What’s a Widget? <ul><li>Widgets are movable web applications that focus a lot of power in a small screen space. </li></ul><ul><li>They can do anything a large Web site can do but many can be placed and fit on a single page so you can have everything at your fingertips. </li></ul><ul><li>They don't have to be whole applications; someday you'll be able to connect them yourself to do whatever you want, when and where you want. </li></ul>
  3. 3. What’s a Widget? <ul><li>Widgets are built to share . If you see one you like, you can take a copy and customize it for yourself. </li></ul><ul><li>And use it in your blog, on your web pages, on your computer desktop or on your cell phone. </li></ul>
  4. 4. What’s a Widget Used For? <ul><li>Distribute information... answers, events, places, prices, people... </li></ul><ul><li>Integrate information, analyze it and present it in interesting ways... networks for members, finding the right job, elearning, glue for the virtual company... </li></ul><ul><li>Communicate ... people to people by text, images, audio, video or virtual reality; though computers, phones or cell phones for learning, advertising, sales, support, fun or friends... </li></ul>
  5. 5. What’s a Widget Used For? <ul><li>They're personalized, secure and self-serve. And they're viral , so everyone help distribute information. </li></ul><ul><li>Scheduling for events, facilities or services such as rooms, meetings and people, or transportation, restaurants and hotels </li></ul><ul><li>Shopping - from product/service research to inventory to selection to purchase to payment to shipping to delivery </li></ul><ul><li>Community building for affinity groups - companies, associations, fans, neighborhoods, schools, or churches </li></ul>
  6. 6. Advantages of Widgets <ul><li>Provide &quot; clear &quot; communications (without spam) </li></ul><ul><li>Extend brand beyond Web site </li></ul><ul><li>Powerful search engine optimization tool </li></ul><ul><li>Placed by the user where it will be seen frequently </li></ul><ul><li>On the user's desktop working with pre-loaded information offline </li></ul><ul><li>In mobile environment </li></ul><ul><li>Small and colorful with workflow built-in </li></ul><ul><li>Can be work-focused </li></ul><ul><li>Use same backend and information as web site </li></ul>
  7. 7. Advantages of Widgets I <ul><li>Presence </li></ul><ul><ul><li>they can be placed where the user is... </li></ul></ul><ul><ul><ul><li>home page on Web </li></ul></ul></ul><ul><li> – blog </li></ul><ul><li> – Google start page </li></ul><ul><li> – MySpace </li></ul><ul><li> – Facebook… </li></ul><ul><ul><ul><li>computer desktop </li></ul></ul></ul><ul><ul><ul><li>cell phone </li></ul></ul></ul><ul><ul><li>they can indicate others’ presence </li></ul></ul><ul><ul><li>they present results to the user </li></ul></ul>
  8. 8. Advantages of Widgets II <ul><li>&quot; Push &quot; - the user &quot;pulls&quot; the widget but it's information is pushed to the user </li></ul><ul><li>Customization – they can be customized by the provider, the user or in response to user behaviors </li></ul><ul><li>Distribution - can be spread virally, see one you like and take a copy (and get an account if required) </li></ul>
  9. 9. Advantages of Widgets III <ul><li>Security - the owner can control who gets them and user's identities; misbehavior can be punished, leads to trust </li></ul><ul><li>Footprint - small (so many can be at the user's figure tips) with carefully thought out workflow </li></ul><ul><li>Anywhere - works online and offline or with intermittent connections </li></ul>
  10. 10. Anatomy of a Widget <ul><li>1. Click &quot;View Profile&quot; or the image at top left to see the widget owner details. </li></ul><ul><li>2. There are two main views: list view and calendar view (this example shows list view). Click this button to toggle between them </li></ul>From: attendio.com/widgets/about
  11. 11. Anatomy of a Widget <ul><li>3. The widget's &quot;owner&quot; can add new events by clicking this button </li></ul><ul><li>4. Click any event to see its details page in Attendio. Details pages supports images, maps, more info, etc. </li></ul>From: attendio.com/widgets/about
  12. 12. Anatomy of a Widget <ul><li>5. Users can click the calendar icon under the event to save event details to their personal calendar (Outlook, Google Calendar, iCal, etc). </li></ul><ul><li>They can click the email icon to tell Friends about the event via email, and click the Mobile icon to set up a mobile reminder. </li></ul>From: attendio.com/widgets/about
  13. 13. Anatomy of a Widget <ul><li>6. Change category here if the widget's owner is listing events in more than one category. </li></ul>From: attendio.com/widgets/about
  14. 14. Anatomy of a Widget <ul><li>7. Users can change their location to see events only in their area. We advise leaving the location as &quot;All of USA&quot; for most widgets. </li></ul>From: attendio.com/widgets/about
  15. 15. Anatomy of a Widget <ul><li>8. Change category here if the widget's owner is listing events in more than one category </li></ul><ul><li>9. Fans can click &quot; Grab it! &quot; to get a copy of this widget for their own site or a fan site. </li></ul>From: attendio.com/widgets/about
  16. 16. Event Settings
  17. 17. Place the widget other places