1 / 36

Application and UX Design For Large Data Sets

Application and UX Design For Large Data Sets. Taylor Bastien | Senior Systems Analyst, 4Point. Who Am I?. My name is Taylor Bastien I’m a senior software consultant at 4Point , in Ottawa, Canada

rudolf
Download Presentation

Application and UX Design For Large Data Sets

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Application and UX Design For Large Data Sets Taylor Bastien | Senior Systems Analyst, 4Point

  2. Who Am I? • My name is Taylor Bastien • I’m a senior software consultant at 4Point, in Ottawa, Canada • I have a dual role as both a User Experience Designer and a Technical Architect, depending on the project • I have a bachelor’s degree in Arts and one in Computer Science • I am a contributor to UXMagazine (UXMag.com) and an Adobe Certified Expert (ACE) in Flex and a CertifiedJavaProgrammer • Who are 4Point? • We’re a company of about 50 people and an Adobe Business Partner • Our clients include Fortune 500 companies and governments of all levels, spanning North America and into the UK and Japan

  3. Words of wisdom • You can’t take calculus! You’re in Arts, you’ll fail. Former Housemate

  4. UX and Software Design User Experience Design • The practice of conceiving interactive experiences maximizing user comfort, pleasure, confidenceand productivity Software Design • The practice of inventing software that is efficient, maintainable, robust and functionally complete

  5. UX and Software Design User Experience Design • Expression of • Art • Design • Psychology • Aesthetic Creativity Software Design • The practice of conceiving software that is efficient, maintainable, robust and functionally complete

  6. UX and Software Design UX Design + Software Design ≈ RIA Development User Experience Design • Expression of • Art • Design • Psychology • Aesthetic Creativity Software Design • Expression of • Science • Problem Solving • Mathematics • Technical Creativity

  7. Words of wisdom • [W]e’ve tried to be at the intersection of technology and liberal arts. We make things that are easy to use, fun to use — they really fit the users. Steve Jobs

  8. When Worlds Collide!

  9. Two Worlds – Flex RIAs With LCDS Client Side • Flash Player • Multi-platform runtime for delivering Rich Internet Applications (RIAs) • On 99% of Internet-enabled PCs • AS3 & Flex • Serious, Object-Oriented rapid development of expressive RIAs • Mature, industry-leading tooling (Flash Builder/Eclipse) • Deep API allows the creation of highly dynamic user experiences • Flash Catalyst • Designers get in on the fun

  10. Two Worlds – Flex RIAs With LCDS Server Side • Java, .NET, PHP, ColdFusion • LiveCycle Data Services • Blazingly fast data transfer w/ AMF • Transfer typed data between your back and front-ends • Data push keeps your UIs up to date in real-time • Manage data in offline mode by caching changes for automatic synchronization on re-connect • Benefit from advanced modeling tools to graphically map data sources to the front-end data model

  11. Two Worlds – Flex RIAs With LCDS Client Side Server Side Expressive Responsive Flexible Powerful Fast Adaptable Now let’s apply these principles to a real-world challenge.

  12. Too Much Information? • Humankind is able to store at least 295 exabytes of information2 • That’s 295,000,000,000,000,000,000 bytes! (2.95 x 1020) • i.e. if a star is counted as a single bit of information, that’s a galaxy of information for every person in the world • i.e. 315 times the number of grains of sand in the world • But it's still less than one percent of the information that is stored in all the DNA molecules of a single human being • The biggest problem isn’t storing massive amounts of information, it’s in displaying and working with so much data.

  13. Words of wisdom • I didn’t have time to write a short letter, so I wrote a long one instead. Mark Twain

  14. Intro to Information Density • Information Density (or “ID”) is defined as follows: • The quantity of visible node instances containing information divided by the screen space area of the whole interface in pixels.1 • In plain English: • It’s the total amount of information displayed per unit of visible space. • “Information” isn’t only the data, but also the elements making up the user interface containing the data (e.g. buttons, sliders, labels, etc.) • ID differs from Data Density, which is measured in bits of actual content

  15. How Nature Handles Information Density • Our minds and senses are incredibly powerful at filtering information, subconsciously discarding unneeded info • Every waking hour, our brains are being trained to process the information around us, not so for processing information displayed in a UI • Our UIs need to therefore model their approach to presenting information on how the “real world” presents it

  16. Intro to Information Density • At what point does a little more information become way too much information? Usefulness Information

  17. Intro to Information Density • At what point does a little more information become way too much information? Usefulness Information

  18. Intro to Information Density • At what point does a little more information become way too much information? Usefulness Information

  19. Intro to Information Density • At what point does a little more information become way too much information? Usefulness Information

  20. Intro to Information Density • At what point does a little more information become way too much information? Usefulness Information

  21. Intro to Information Density • At what point does a little more information become way too much information? Usefulness Information

  22. Intro to Information Density • At what point does a little more information become way too much information? Usefulness Information

  23. Key Information Density Challenges • At what point does a little more information become way too much information? • It depends. • Who is consuming / processing the information? • What isthe nature of the information? • For what purpose do they need the information? • It can be near impossible to know how much is just right for the current user, data and situation. • It is, however, …

  24. Some Solutions • There are many possible solutions to reaching an ideal level of ID • Give users control over the level of Information Density • Aggregate / Condense Information • Eliminate or hide extraneous information

  25. User Control Over Information Density • We know that different users process information differently • Allow them to customize the level of detail

  26. Condense/Aggregate Information • It is easier to process large amounts of data if they have been pre-processed into a condensed form • e.g. graphical representation of data

  27. Empower Users Through Filtering and Searches • Individuals know what info they need and for what purpose they need it • Allow them to filter large data sets to the essential items they care about • Through filtering, including: • Search-style filters • Time-based constraints • Searching • By keyword

  28. Examples • This is where I will present real live examples of Flex applications that demonstrate the key approaches to displaying large data sets • Varying information density • Visually condensing information • Providing fast filtering/searching of information

  29. Tying It All Up • There is a point of diminishing returns as ID increases. • You’ll never attain the perfect level of Information Density for all users in all cases. • Every user is unique. • Their mindset is unknown. • Their current objectives might also be unknown. • Empower your users • to set their own level of ID through: • Adaptive renderers and controls • Graphical aggregation and condensation of large amounts of information • Filters and searches • By keeping a balanced view of ID and trusting your instincts, innovate.

  30. References • 1 - http://hcil.cs.umd.edu/trs/98-13/node126.html • 2 - http://www.sciencemag.org/content/332/6025/60 • Photo credits: NASA, NASA/JPL-Caltech

  31. Standard Black Background Bullet Slide • Level 1 Bullet • Level 2 Bullet • Level 3 Bullet

  32. Bar Chart Try to use neutral colors for most chart elements, and highlight elements of interest with bright colors

  33. Pie Chart Try to use neutral colors for most chart elements, and highlight elements of interest with bright colors

  34. White Content Area Layout This template has one master with several layouts This is the standard layout suitable for most slides. If you want a black or gray background (examples of which are on the following slides), right-click the thumbnail of the slide in the left-hand “Slides” pane , select “Layout”, and pick the layout that you want. This should not affect text or chart colors.

  35. Color Palette Dynamic R - 255 G - 0 B - 0 R – 251 G - 176 B - 52 R - 255 G - 221 B - 0 R - 193 G - 216 B - 47 R - 0 G - 164 B - 228 R - 131 G - 72 B - 181 Neutral R - 218 G - 221 B – 224 R - 172 G - 179 B - 185 R - 107 G - 115 B - 123 R - 228 G - 223 B - 217 R - 192 G - 181 B - 169 R - 136 G - 120 B - 104

More Related