Grant Carmichael, profile picture
Uploaded byGrant Carmichael
PDF, PPTX1,760 views

The Flexibility of Omnigraffle...Macro and Micro

The document outlines various functionalities of an account management system for instructors and students, including class creation, template management, and book assignment. It also describes user experiences with a cloud-based project setup, detailing issues faced during user account creation and project management. Additionally, there is a scenario illustrating a user's journey in searching for a product through a mobile app, emphasizing search capabilities and user interaction.

Embed presentation

Download as PDF, PPTX
The Flexibility of Omnigraffle...Macro and Micro VC Fund IP Law Corporation Patent Office Search Firm University Startup Abhinav Kirsten Ritesh Jessica Henry Saraara Linda Tim Victoria Katie Brian Peter Kurt Massi Barry Gavin Deb Sarah Sam Will Andrew Examiner Tom Inventor Jakob Expert Sachin Marketing Counsel License Invest Invest License Apply Apply Hire Hire Expert Expert Inventor Inventor Hire Instructors Wizard Reference Support • Guides for managing experiences • Instructor community • Preview other textbooks Build ClassAccount Student Feedback Update notices Admin messages Build new Template* Choose Template based on amount of ped content: • Low - Text only • Med - Balanced • High - Full Experience • Custom Edit Template • +/-tasks Launch Class Admin Consult and build resources Define Templates My Classes Choose Context: • Traditional • Online • Hybrid Assign Textbook Create Class Assign Students (Manual or batch) and class size May inherit customization from previous classes Students Email link to buy book/ get account Set Up Account Determine which chapters to flag as being covered in the class Choose, duplicate class Credentials to enable Instructor access Q: Does an Instructor want to see a dashboard with Student progress , all class overview here? Book Selection Create Class Assign Students Assign Students Batch input student list Manually enter student names Create new account Input Name or choose name Input school input credentials Input class name id for each class Get help on process Create a Class Duplicate Class Define what attributes to include if duplicate Define class start/end dates PIck class (CRUD) Setup Account Create Syllabus Choose textbook build lesson plan Establish grading Find a book Search for Title, Author Browse by subject Browse titles Input class name id for each class List import Link generator Templates predefined Preparation Create Account form Reference on how to create account Buy a book Add book to library Review sample textbook Purchase book Assign book Choose Book from library Search for book Book store Search Library of purchases Update account Update Profile Add my photo Review Profile Purchase History Profile Edit Textbook provides lesson plan? Reference on how to purchase Book preview, details Create class wizard Reference on how to create class Build Template Build Custom Template +/- tasks from experience list Delete Custom Template Name Template Schedule Define Class Choose Context Choose Template Edit Template +/- tasks Calendar Task list for each template Dashboard Equipment Surveys Maps Reports Planner Learn Campus Name 1 Campus, 5 Buildings Hello Ann Terry MacIntosh 888-288-8888 Your Company Rep Email Terry Chat now with Company Support… Utility Co. System Health University Campus 90.5% Dashboard 5 Power Equipment LifePerformance Good Days since last error message: 27 days 2014 upgrades have already saved over $50k! Jump to Surveys Efficiency H20 Costs University Campus Consumption 25 March Actual Loss counter $129,231 Actual losses incurred to date from unrepaired equipment reported on last survey 5 March 2014 $129,231-$287,221 Estimated loss range 48/382 Top Alerts More… Alert Type 9:00 am 2 Apr 2014 U/Food Warehouse High Alert Type 8:00 am 2 Apr 2014 U/Food Warehouse High Alert Type 7:00 am 2 Apr 2014 U/Food Warehouse High Active Work Orders More… Work Type 8:00 am 2 Apr 2014 WMU/Food Warehouse Work Type 9:00 am 2 Apr 2014 WMU/Food Warehouse $6250 Estimated investment 2 3 Legionella ! Inlet Set Point 1 4 5 4.1 8 3 2 6 7 $129,231-$287,221 Estimated loss range 0/211 Active Work Orders More… Work Type 8:00 am 2 Apr 2014 U/Food Warehouse Work Type 9:00 am 2 Apr 2014 U/Food Warehouse 4.2 1 year 1 year 9 OmniGraffle Grant Carmichael of The Understanding Group | @thinkxd
TUG Information Architecture Process programming analysis synthesis specification HOWWHAT architect design Business Goals Interview Stakeholders Intention Modeling Current State Interview Users Benchmarking Future State Personas Experience Maps Structural Design Taxonomy Instruct Sitemaps Wireframes
Research...
Current State Journey Map: Overview Aware Onboard Build Manage Evolve Close Email Home Tool Admin Documents Communities Support External 5 ? a 11 17 12 g 7 9 10 b e ? ? 4 a f ? 6c d e ? h 13 14 15 18 20 21 22 16 18 19 Chuck Business Mgmt + Sys Admin Adaline Dev + Sys Admin 1 gb c d f b 5 8 6 Configure 23 24 25 28 28 26? 27 28 28 28 28 28 28 35 35 3630 31 32 33 ? 3a ? ? ? ? ? ? ? 34 ? ? ? Failure Errors Confusion Wait Time
Current State Journey Map: Detail Email Home Tool Admin Documents Communities Support External 5 ? 10a 11 12 4g 7 9 10 10b ? 3e ? ? 4 4a 4f ? 64c 4d 4e ? 4h 13 14 15 16 Adaline Dev + Sys Admin 3g3b 3c 3d 3f 4b 5 8 6 Chuck Business Mgmt + Sys Admin 3a 3a. Chuck, who tends to take lead on business oversight, attempts to kick off a Trial Account, assuming he will then pass along the more particular technical details to Adaline. Unsure how to proceed. After clicking through the three main graphical invitations, he realizes, based on the video, that he should be creating a project. 3b. Chuck clicks “Create Project” -- only to get an alert that that he has to have an account first. So he guesses he may need to use “Manage Account”, even though he doesn’t have an account yet, and the instructional video didn’t mention this step. 3c. In the “Manage Account” modal, Chuck is not sure how the process works for setting up an account, beyond filling out the forms. He hovers over the “?” icon by the Account Type drop-down menu, and sees a director will need to approve, but doesn’t know how long it will take, what he will get with Trial versus Production, or why there are such restrictions on what is billed as a flexible service infrastructure. 3d. In the form, he isn’t sure what an “Application Account” is, and doesn’t understand why the help text says 30 days but the expiration period is 60 days. He assumes a Trial Account can be upgraded later, rather than having to start over. 3e. The purpose of the Associated Projects step is not clear, but Chuck sees it is Optional, so moves along. 3f. Chuck wants to add Adaline and other team members to the account, but does not see an opportunity to do so -- the Associated Users step lists only him. 3g. After Submitting, Chuck sees a pop-up confirming his request was submitted, and mentioning who will be reviewing it. 4. Automated email confirmation that the system received submission. 4a. He finally receives an email saying the Trial Account is approved a day later. 4b. Chuck wonders how he will be able to collaborate across the team, using this account structure. He clicks “Manage Account” after approval, but sees it is the same Account Creation process, but with his current account information pre-filled, with the option to create a new one. He wonders if this means he could create more than one account, and if that will be necessary. 4c. Chuck selects “Create Project” to start the request for for Compute, Storage and Network resources so he can kick the tires of the Product. 4d. Chuck walks through the three-step pop-up 4e. Chuck notices the “i” icon and reads the instructions there, but sees nowhere to choose small, medium, large, or x-large options. It’s unclear if that information is supposed to be stated in the “Description” field. He does his best to describe what they need. 4f. He submits the request for the Project and waits for manual approval 4g. After 2 days, Chuck receives an email notifying him his Project is approved (He is still wondering why so many constraints, and who approved his project, or why). 4h. Chuck forwards the trial-account-approval email notification he receives to Adaline. “Can you get us a project spun up?” 5. Adaline goes to cloud.Cloudco.com to set up a project, but doesn’t see that she is on an existing project. She contacts Chuck, asking how she can get access. 6. Chuck remembers seeing something about adding users in the account creation wizard. He tries the Manage Account tool again, but sees no way to add users. 7. Chuck wonders how to add Adaline and other team members, so he tries the Support link in the header, but finds it only takes him to an Overview page, with no instructions -- he has already agreed to try the service, so isn’t interested in the content marketing the service to him. 8. Chuck notices there is a Support section in the footer, and tries the FAQs link. He sees no search ability, so he user Control-F to find what he is looking for using keywords like “access” and “add” but sees no help for his question. 9. Chuck goes back to the previous page, and tries the “Support Info” link in the footer, but sees it is only about how to create a support ticket. He doesn’t want to bother with that process, since nothing is broken, he only needs an answer to a simple question. 10. Chuck tries the Documentation link from the footer. 10a. Chuck finds a list of resources; the only one that looks relevant is the User Guide, which he navigates to. 10b. Chuck searches for “access” in the PDF, and stumbles across the section on Add Users to a Project. 11. Chuck goes back to the Home page, and clicks “Go To My Projects” 12. Chuck sees there is a Project listed as a rectangular panel, listed under the name he gave it. At this point, he doesn’t remember what the User Guide said, and isn’t sure where he found it, so he looks around the page for what he should do. 13. He tries the gears icon and sees there are management tools linked there. 14. Chuck tries “Manage Project Access” and sees there is a way to add team members; he isn’t sure what permissions will be ascribed to a “user” versus an “administrator” but he selects the empty name field to add Adaline. 15. He thinks the field to enter her name isn’t working at first even though he highlight the whole row when he selects the field until he realizes that he has to select the magnification glass icon specifically. He finds he has to input Adaline’s full name “Adalineline” in the pop-up search window in order for her name to show up in the results list. He adds her to the project. 16. He realizes he ought to check with Adaline on what specifics he should choose configure the Project. He writes an email to Adaline to asking her to configure the project. ? ? ? ? ? ? ? ? ? ? ? ? ? Failure Errors Confusion Wait Time
Line of Visibility Messages/Email Support Home Dashboard Services Store KEY TransparencyPrinciples: Contextual learning Semantic clarity Simplicity Proactivity Backstage Future State Journey Map: Overview 11 5 Aware Onboard Build Manage Evolve Close 1 6 5 12 14 14 a 15 15 a 17 18 18a 19 19 a 19 a Chuck Business Mgmt + Sys Admin Adaline Dev + Sys Admin 2 6 7 8 9 3 3a 6a 4 4a 4b 4c 4d 11 11 11 11 11 3a 14 a 9 15 a 17 19 a > Search platform > Taxonomy Mgmt system > CMS > Forums > Support platform Full Ecosystem 6 7 8 9 117 8
Line of Visibility Messages/Email Support Home Dashboard Services Store KEY TransparencyPrinciples: Contextual learning Semantic clarity Simplicity Proactivity Backstage Future State Journey Map: Detail 4a 4b 4c 6 5 4d 4. Armed with recommendations from the Cloud Readiness Check, Chuck has what he needs and thinks it makes sense to create an account. So he selects Get Started to start the workflow of establishing a Product account. a. He reviews the account levels and support package options presented to him and notices that the ones recommended are flagged and preselected. He can review all options listed by expanding contextual help icons for more details. b. He is prompted to add other users that will be able to access the account. Chuck, being an internal tenant and logged in to the network, has an initial view of everyone in his department to choose from and a quick lookup with autocomplete of any other user with Cloudco credentials. c. He can select multiple users to save as named groups which, along with lists of recent additions, will help to speed-up batch assignments to projects in the future. He can always edit his team in Account section or adjust per project. d. Before he submits the application, he is asked to confirm his email and sees an estimate of how long it will take for approval but, he can start to create placeholder projects in the meantime. He submits the application and gets a confirmation on-screen and via email. 5. He is quickly approved, indicated by an email and with an alert in the Messaging portion of the UI. He follows the link to the Dashboard. 6. Chuck has to sign in only once, because all regions and systems related to Product recognize his credentials. In the Dashboard, Chuck has a global view of all projects within an account, and can view, filter and edit by performance, billing and user status across regions. a. He remembers to add Adaline, who will configure the instances. He opens a User search tool while in the Product Dashboard to Search for Adaline (finds “Adaline” even though her name is “Adalina”) and drags her to the two projects. 4 > Metadata for User DB > User Preference DB > Consistent approval timeframes > In-context help content > Authentication > Live system status reporting > Live cost reporting Taxonomy system CMS Unified platform Development 6a Onboard Chuck Business Mgmt + Sys Admin
Scenario Flagging Sara is looking for details on available window air conditioners from Store Sara just boarded the train and while grabbing an open seat, opens her iPhone and is desperately in search of a window air conditioner for her apartment. As she opens her Store app which has defaulted to her home store location. She types in the search box "air conditioner" which results in a list of varying products including air conditioners [multiple types] to hair conditioner. She is able to quickly filter by department and clicks home improvement. She is narrowed down to just air conditioners. She is presented one additional filter that allows her to filter by stand alone, window or other types of air conditioners. She filters by Window and receives six types of window air conditioners. Sara locates a window air conditioner and clicks on the result to go to a product detail page. There she is able to see a product image as well as color options. She sees details on how much space it will cool and knows that will cool her apartment. Sara reads the full description and then notices customer reviews and that the a/c unit she's looking at has an average rating of 4.5 out of 5. She also notices that there is a link to check availability. When she taps it she is able to see that there are no units available at her local store but she is provided additional area stores near her that have available stock as well as an option to have it shipped to her home. Sara decides that she will add one of the units to her cart found at the next closest store. Sara Goal Search for window air conditioner Context Using iPhone on public transportation Status: desperate Features (Product Detail) Default Home store Availability at home store Availability of stores nearby Option to ship Add to cart from another store Features (Optional) Customer reviews: summary and individual reviews Features (Search) Search results of varying products Filter by department, type of air conditioner (standalone, window, other) Product details: image, color options, specifications
Scenario Task Flow Product Detail Search Results Cart Search (in product context) Option 3 Option 1 Type “Air Conditioner” Sara Option 2 Scenario 3 Looking for details on available window air conditioners from Store See Page 3 Add to Cart In-stock Store list Make required selection (size, etc.) In stock? Review details YES NO Change to Home store for Order Floorplan Map Change store? NO YES Review Search contextual Result list (products) Filter by Dept. (Home Improvement) narrows to Air cond. Filter by Attribute (window) Review filtered Search Result list (6 products) Select Product to go to detail Change Search category (initiates targeted search)
Rewards Notes 20.0a Mobile Search Input Autocomplete in-progressSara Behavior of search criteria is dependent on the backend capabilities. Opens search input field Search input field Input persists until manually cleared or session ends Auto complete selections Displays category and # of results (if possible) 1.0 2.0 3.0 Cart Air _ Search Air Popped Popcorn in Grocery (3) Air Conditioners in Home Improvement (34) Air Filters in General Merchandise (18) Air Compressed in Office Supplies (2) Air Pump in General Merchandise (7) She types in the search box "air conditioner" which results in a list of varying products including air conditioners [multiple types] to hair conditioner. 1.0 2.0 3.0 Wireframe 1
Rewards Notes Add to List Add to Cart L’Oreal Hair Conditioner $5.99 Reg. $6.49 Save $0.50 Honeywell Stand-alone Air Conditioner $114.99 Reg. $124.99 Save $10.00 Honeywell Window Air Conditioner $124.99 In-stock at Shadyside In-stock at Shadyside ••• ••• ••• Cart 20.2 Mobile Search Results: Cart Add item to cartSara Add to Cart ⁃ Animation of addition recommended ⁃ (default =add 1 to cart) Indication of # of items in cart (increments when items added from search result) Indication of # of items in cart (increments with each tap) 1.0 2.0 3.0 Add to Favorites In-stock at Shadyside 1.0 1 2.0 (34) Results for “Air Conditioner” Filters Price Low-High 1 3.0 Honeywell Window Air Conditioner $124.99 In-stock at Shadyside ••• Sara decides that she will add one of the units to her cart found at the next closest store. Wireframe 2
Telling the Whole Story...the Macro and Micro Scenario Map: Needing Motivation Joe Context Joe graduated High School 10 years ago. He has been unemployed for 6 months and last worked for a local manufacturer and is considering taking classes. He finds out about the Map Your Future platform at a Community Center Kiosk More personal inquiry If enrolled in a school eventually, Joe can link his account to the one set up for him. This enables even further value with Advisor and academic progress input Career Map My JobsJobs Map Your Future Job Title City Salary Job Title City Salary Job Title City Salary Job Title City Salary Industrial EngineerCategories Add to My Jobs My Profile Industrial Engineer City Salary Filters more like this Local State All Skills Skills Skills Education Outlook Prospect A good fit LXP AXP Prefs Next Healthy Job growth Projected Summary Salary Career Map My JobsJobs Map Your Future Progress My Profile Classes Industrial Engineer Field Industrial Engineer Aerospace Engineer Electrical Engineer GRCC Industrial Enginee Skills Skills Skills Education Outlook Prospect A good fit LXP Healthy Job Summary Salary Remove Access Map Your Future: Wants to Investigate Careers and schools Skills Survey General Survey To discover life experiences that link to potential career paths ACADEMIC Create Account Selected school’s classes added to career map Pick target School Link to School Admissions info Learn what local jobs are ‘hot’ and also suited to reported life skills Learn about unfamiliar job titles and what skills are relevant through video interviews and discussions from other users CAREER Add Jobs to Career Map, see suggested classes What is an Industrial Engineer? Discussions Description Attributes Personalized Service Basic Service Add to My Jobs and view on Career Map Degree TBD 4 yrs Remaining 0% More like this
Pros & Cons of Omnigraffle Pro + 1. Easy and powerful Macro (diagramming) and Micro (wireframes) 2. Hard to lose stuff: Copy elements from autosaved points in the past! 3. Excellent multi-page PDF export, editable in Illustrator and vice-versa Con - 1. Doesn't match Illustrator for custom shapes or InDesign for text handling 2. Interactive prototyping is very basic and only in-app or PDF 3. Mac-only Grant Carmichael of The Understanding Group | @thinkxd

More Related Content

DOCX
Research paper
byKhalid
 
PPTX
Giant Low-Fidelity Analog Wireframes (IxDA GR - June 2015)
byJessica DuVerneay
 
PDF
By the Book: How Great User Experiences in Software Can Impact Government and...
byEffectiveUI
 
PDF
NDC 2011 - Building .NET Applications with BDD
byjbandi
 
PDF
"Open" includes users - Leverage their input
byRandy Earl
 
PPT
Final wireframes from screen concept to user interaction v0.4
byMia Horrigan
 
PPTX
Mark Lubeck's Work Samples
bymrl1756
 
PPTX
User Testing your Drupal Administration Process
byVanessa Turke
 
Research paper
byKhalid
 
Giant Low-Fidelity Analog Wireframes (IxDA GR - June 2015)
byJessica DuVerneay
 
By the Book: How Great User Experiences in Software Can Impact Government and...
byEffectiveUI
 
NDC 2011 - Building .NET Applications with BDD
byjbandi
 
"Open" includes users - Leverage their input
byRandy Earl
 
Final wireframes from screen concept to user interaction v0.4
byMia Horrigan
 
Mark Lubeck's Work Samples
bymrl1756
 
User Testing your Drupal Administration Process
byVanessa Turke
 

Similar to The Flexibility of Omnigraffle...Macro and Micro

PDF
Unicorn Invasion: The Next Level of Sparkle and Stuff
byBrandy Porter
 
PDF
Implimenting and Mitigating Change with all of this Newfangled Technology
byIndiana Online Users Group
 
PPTX
Targeted documentation
byAlyssa Fox
 
PDF
UX Portfolio - nom.bravo
byJohn Thompson
 
PPTX
Guerilla Human Computer Interaction and Customer Based Design
byQuentin Christensen
 
PPT
The Many-Tentacled Beast
byMichael Seidel
 
PPTX
Novelty in Non-Greenfield
byJustin Lovell
 
PPTX
Targeted documentation STC Houston, Mar 20, 2012
bySTC_Houston
 
PDF
Agile: It's not just for engineers anymore!
byMark Congiusta
 
PDF
User Experience Bootcamp for Developers
byCatherine Robson
 
PPTX
Usability Testing for Technical Writers
byDimiter Simov
 
PDF
Next Gen Project - Case study
byqueen533279
 
PDF
Old Tech to Shiny New Tech: Strategies on Upgrading Your Code Without a Big Bang
byCristina Ruth
 
PDF
Using alfresco share as a corporate intranet
byAlfresco Software
 
PPT
Intranet Usability Testing
byJohn Sorflaten, PhD, CUXP
 
PPT
User needs vs buisness needs v5a
byMia Horrigan
 
PDF
Agile gathering + guidelines stories
byfungfung Chen
 
PDF
User Interface and User Experience - A Process and Strategy for Small Teams
byDamon Sanchez
 
PDF
13 Signs Your UX Needs an Exorcism
byCrystal Beasley
 
PDF
Trevo project management documentation
byTuononenP
 
Unicorn Invasion: The Next Level of Sparkle and Stuff
byBrandy Porter
 
Implimenting and Mitigating Change with all of this Newfangled Technology
byIndiana Online Users Group
 
Targeted documentation
byAlyssa Fox
 
UX Portfolio - nom.bravo
byJohn Thompson
 
Guerilla Human Computer Interaction and Customer Based Design
byQuentin Christensen
 
The Many-Tentacled Beast
byMichael Seidel
 
Novelty in Non-Greenfield
byJustin Lovell
 
Targeted documentation STC Houston, Mar 20, 2012
bySTC_Houston
 
Agile: It's not just for engineers anymore!
byMark Congiusta
 
User Experience Bootcamp for Developers
byCatherine Robson
 
Usability Testing for Technical Writers
byDimiter Simov
 
Next Gen Project - Case study
byqueen533279
 
Old Tech to Shiny New Tech: Strategies on Upgrading Your Code Without a Big Bang
byCristina Ruth
 
Using alfresco share as a corporate intranet
byAlfresco Software
 
Intranet Usability Testing
byJohn Sorflaten, PhD, CUXP
 
User needs vs buisness needs v5a
byMia Horrigan
 
Agile gathering + guidelines stories
byfungfung Chen
 
User Interface and User Experience - A Process and Strategy for Small Teams
byDamon Sanchez
 
13 Signs Your UX Needs an Exorcism
byCrystal Beasley
 
Trevo project management documentation
byTuononenP
 

Recently uploaded

PPTX
Strategy Infographics by Slidesgo.pptx
byAdilsonJnior27
 
PPTX
Demo (2).pptxnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnn
byrossanthonytan130
 
PDF
My Portfolio_ 10-01-2026 - Emmanuel Kojo Blebu
bybraynx
 
PDF
Atlier Seraphine Design Document: Resident Evil The Village
byharsha23namjoshi
 
PDF
Opium_Magazine_images_that_attack_the_eye.pdf
bybauermarija25
 
PDF
EITCI certification exam dumps and study materials
byCerts Area
 
PPTX
Karlshochschule International University Transcripts
byz7bw9spizq
 
PPTX
California State University, Sacramento Transcripts
by0skg73ls1b
 
PDF
Atelier Seraphine: Game Design Document, Resident Evil
byharsha23namjoshi
 
PDF
Operation Theatre, Intensive Care Unit, Cardiac Care Unit
byUshnaKhawer
 
PDF
A Comprehensive Guide to Mobile App Design 2026.pdf
byDesign Studio UI UX
 
PPTX
National Art School Transcripts
by376x4gqj02
 
PDF
Turn Your Dream Home into Reality with Design House!
bydaytasksolutions
 
PDF
LITERATURE CASE STUDY,I.pdfIrirIzkgzlylgslsglsltsktsltsltss
byjp0718076
 
PDF
DOMINO88 MERUPAKAN SITUS ANDALAN INDONESIA
byDOMINO88 VIP
 
PPTX
EEE-428-presentation for this course.pptx
byjokilax514
 
PPTX
Hospital design and architecture standard newferts
byLOVNEETRAO
 
PDF
Digital Marketing Made Simple Infographic Instagram Post.pdf
byaadimehto78
 
PDF
DRAFT RIK SANSONE Experience Leadership Portfolio 2026.pdf
byRik Sansone
 
PDF
Stranger-Things-AI-Prompts-Creating-the-Upside-Down.pdf
bySync Blogs
 
Strategy Infographics by Slidesgo.pptx
byAdilsonJnior27
 
Demo (2).pptxnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnn
byrossanthonytan130
 
My Portfolio_ 10-01-2026 - Emmanuel Kojo Blebu
bybraynx
 
Atlier Seraphine Design Document: Resident Evil The Village
byharsha23namjoshi
 
Opium_Magazine_images_that_attack_the_eye.pdf
bybauermarija25
 
EITCI certification exam dumps and study materials
byCerts Area
 
Karlshochschule International University Transcripts
byz7bw9spizq
 
California State University, Sacramento Transcripts
by0skg73ls1b
 
Atelier Seraphine: Game Design Document, Resident Evil
byharsha23namjoshi
 
Operation Theatre, Intensive Care Unit, Cardiac Care Unit
byUshnaKhawer
 
A Comprehensive Guide to Mobile App Design 2026.pdf
byDesign Studio UI UX
 
National Art School Transcripts
by376x4gqj02
 
Turn Your Dream Home into Reality with Design House!
bydaytasksolutions
 
LITERATURE CASE STUDY,I.pdfIrirIzkgzlylgslsglsltsktsltsltss
byjp0718076
 
DOMINO88 MERUPAKAN SITUS ANDALAN INDONESIA
byDOMINO88 VIP
 
EEE-428-presentation for this course.pptx
byjokilax514
 
Hospital design and architecture standard newferts
byLOVNEETRAO
 
Digital Marketing Made Simple Infographic Instagram Post.pdf
byaadimehto78
 
DRAFT RIK SANSONE Experience Leadership Portfolio 2026.pdf
byRik Sansone
 
Stranger-Things-AI-Prompts-Creating-the-Upside-Down.pdf
bySync Blogs
 

The Flexibility of Omnigraffle...Macro and Micro

  • 1.
    The Flexibility ofOmnigraffle...Macro and Micro VC Fund IP Law Corporation Patent Office Search Firm University Startup Abhinav Kirsten Ritesh Jessica Henry Saraara Linda Tim Victoria Katie Brian Peter Kurt Massi Barry Gavin Deb Sarah Sam Will Andrew Examiner Tom Inventor Jakob Expert Sachin Marketing Counsel License Invest Invest License Apply Apply Hire Hire Expert Expert Inventor Inventor Hire Instructors Wizard Reference Support • Guides for managing experiences • Instructor community • Preview other textbooks Build ClassAccount Student Feedback Update notices Admin messages Build new Template* Choose Template based on amount of ped content: • Low - Text only • Med - Balanced • High - Full Experience • Custom Edit Template • +/-tasks Launch Class Admin Consult and build resources Define Templates My Classes Choose Context: • Traditional • Online • Hybrid Assign Textbook Create Class Assign Students (Manual or batch) and class size May inherit customization from previous classes Students Email link to buy book/ get account Set Up Account Determine which chapters to flag as being covered in the class Choose, duplicate class Credentials to enable Instructor access Q: Does an Instructor want to see a dashboard with Student progress , all class overview here? Book Selection Create Class Assign Students Assign Students Batch input student list Manually enter student names Create new account Input Name or choose name Input school input credentials Input class name id for each class Get help on process Create a Class Duplicate Class Define what attributes to include if duplicate Define class start/end dates PIck class (CRUD) Setup Account Create Syllabus Choose textbook build lesson plan Establish grading Find a book Search for Title, Author Browse by subject Browse titles Input class name id for each class List import Link generator Templates predefined Preparation Create Account form Reference on how to create account Buy a book Add book to library Review sample textbook Purchase book Assign book Choose Book from library Search for book Book store Search Library of purchases Update account Update Profile Add my photo Review Profile Purchase History Profile Edit Textbook provides lesson plan? Reference on how to purchase Book preview, details Create class wizard Reference on how to create class Build Template Build Custom Template +/- tasks from experience list Delete Custom Template Name Template Schedule Define Class Choose Context Choose Template Edit Template +/- tasks Calendar Task list for each template Dashboard Equipment Surveys Maps Reports Planner Learn Campus Name 1 Campus, 5 Buildings Hello Ann Terry MacIntosh 888-288-8888 Your Company Rep Email Terry Chat now with Company Support… Utility Co. System Health University Campus 90.5% Dashboard 5 Power Equipment LifePerformance Good Days since last error message: 27 days 2014 upgrades have already saved over $50k! Jump to Surveys Efficiency H20 Costs University Campus Consumption 25 March Actual Loss counter $129,231 Actual losses incurred to date from unrepaired equipment reported on last survey 5 March 2014 $129,231-$287,221 Estimated loss range 48/382 Top Alerts More… Alert Type 9:00 am 2 Apr 2014 U/Food Warehouse High Alert Type 8:00 am 2 Apr 2014 U/Food Warehouse High Alert Type 7:00 am 2 Apr 2014 U/Food Warehouse High Active Work Orders More… Work Type 8:00 am 2 Apr 2014 WMU/Food Warehouse Work Type 9:00 am 2 Apr 2014 WMU/Food Warehouse $6250 Estimated investment 2 3 Legionella ! Inlet Set Point 1 4 5 4.1 8 3 2 6 7 $129,231-$287,221 Estimated loss range 0/211 Active Work Orders More… Work Type 8:00 am 2 Apr 2014 U/Food Warehouse Work Type 9:00 am 2 Apr 2014 U/Food Warehouse 4.2 1 year 1 year 9 OmniGraffle Grant Carmichael of The Understanding Group | @thinkxd
  • 2.
    TUG Information ArchitectureProcess programming analysis synthesis specification HOWWHAT architect design Business Goals Interview Stakeholders Intention Modeling Current State Interview Users Benchmarking Future State Personas Experience Maps Structural Design Taxonomy Instruct Sitemaps Wireframes
  • 3.
  • 4.
    Current State JourneyMap: Overview Aware Onboard Build Manage Evolve Close Email Home Tool Admin Documents Communities Support External 5 ? a 11 17 12 g 7 9 10 b e ? ? 4 a f ? 6c d e ? h 13 14 15 18 20 21 22 16 18 19 Chuck Business Mgmt + Sys Admin Adaline Dev + Sys Admin 1 gb c d f b 5 8 6 Configure 23 24 25 28 28 26? 27 28 28 28 28 28 28 35 35 3630 31 32 33 ? 3a ? ? ? ? ? ? ? 34 ? ? ? Failure Errors Confusion Wait Time
  • 5.
    Current State JourneyMap: Detail Email Home Tool Admin Documents Communities Support External 5 ? 10a 11 12 4g 7 9 10 10b ? 3e ? ? 4 4a 4f ? 64c 4d 4e ? 4h 13 14 15 16 Adaline Dev + Sys Admin 3g3b 3c 3d 3f 4b 5 8 6 Chuck Business Mgmt + Sys Admin 3a 3a. Chuck, who tends to take lead on business oversight, attempts to kick off a Trial Account, assuming he will then pass along the more particular technical details to Adaline. Unsure how to proceed. After clicking through the three main graphical invitations, he realizes, based on the video, that he should be creating a project. 3b. Chuck clicks “Create Project” -- only to get an alert that that he has to have an account first. So he guesses he may need to use “Manage Account”, even though he doesn’t have an account yet, and the instructional video didn’t mention this step. 3c. In the “Manage Account” modal, Chuck is not sure how the process works for setting up an account, beyond filling out the forms. He hovers over the “?” icon by the Account Type drop-down menu, and sees a director will need to approve, but doesn’t know how long it will take, what he will get with Trial versus Production, or why there are such restrictions on what is billed as a flexible service infrastructure. 3d. In the form, he isn’t sure what an “Application Account” is, and doesn’t understand why the help text says 30 days but the expiration period is 60 days. He assumes a Trial Account can be upgraded later, rather than having to start over. 3e. The purpose of the Associated Projects step is not clear, but Chuck sees it is Optional, so moves along. 3f. Chuck wants to add Adaline and other team members to the account, but does not see an opportunity to do so -- the Associated Users step lists only him. 3g. After Submitting, Chuck sees a pop-up confirming his request was submitted, and mentioning who will be reviewing it. 4. Automated email confirmation that the system received submission. 4a. He finally receives an email saying the Trial Account is approved a day later. 4b. Chuck wonders how he will be able to collaborate across the team, using this account structure. He clicks “Manage Account” after approval, but sees it is the same Account Creation process, but with his current account information pre-filled, with the option to create a new one. He wonders if this means he could create more than one account, and if that will be necessary. 4c. Chuck selects “Create Project” to start the request for for Compute, Storage and Network resources so he can kick the tires of the Product. 4d. Chuck walks through the three-step pop-up 4e. Chuck notices the “i” icon and reads the instructions there, but sees nowhere to choose small, medium, large, or x-large options. It’s unclear if that information is supposed to be stated in the “Description” field. He does his best to describe what they need. 4f. He submits the request for the Project and waits for manual approval 4g. After 2 days, Chuck receives an email notifying him his Project is approved (He is still wondering why so many constraints, and who approved his project, or why). 4h. Chuck forwards the trial-account-approval email notification he receives to Adaline. “Can you get us a project spun up?” 5. Adaline goes to cloud.Cloudco.com to set up a project, but doesn’t see that she is on an existing project. She contacts Chuck, asking how she can get access. 6. Chuck remembers seeing something about adding users in the account creation wizard. He tries the Manage Account tool again, but sees no way to add users. 7. Chuck wonders how to add Adaline and other team members, so he tries the Support link in the header, but finds it only takes him to an Overview page, with no instructions -- he has already agreed to try the service, so isn’t interested in the content marketing the service to him. 8. Chuck notices there is a Support section in the footer, and tries the FAQs link. He sees no search ability, so he user Control-F to find what he is looking for using keywords like “access” and “add” but sees no help for his question. 9. Chuck goes back to the previous page, and tries the “Support Info” link in the footer, but sees it is only about how to create a support ticket. He doesn’t want to bother with that process, since nothing is broken, he only needs an answer to a simple question. 10. Chuck tries the Documentation link from the footer. 10a. Chuck finds a list of resources; the only one that looks relevant is the User Guide, which he navigates to. 10b. Chuck searches for “access” in the PDF, and stumbles across the section on Add Users to a Project. 11. Chuck goes back to the Home page, and clicks “Go To My Projects” 12. Chuck sees there is a Project listed as a rectangular panel, listed under the name he gave it. At this point, he doesn’t remember what the User Guide said, and isn’t sure where he found it, so he looks around the page for what he should do. 13. He tries the gears icon and sees there are management tools linked there. 14. Chuck tries “Manage Project Access” and sees there is a way to add team members; he isn’t sure what permissions will be ascribed to a “user” versus an “administrator” but he selects the empty name field to add Adaline. 15. He thinks the field to enter her name isn’t working at first even though he highlight the whole row when he selects the field until he realizes that he has to select the magnification glass icon specifically. He finds he has to input Adaline’s full name “Adalineline” in the pop-up search window in order for her name to show up in the results list. He adds her to the project. 16. He realizes he ought to check with Adaline on what specifics he should choose configure the Project. He writes an email to Adaline to asking her to configure the project. ? ? ? ? ? ? ? ? ? ? ? ? ? Failure Errors Confusion Wait Time
  • 6.
    Line of Visibility Messages/Email Support Home Dashboard Services Store KEYTransparencyPrinciples: Contextual learning Semantic clarity Simplicity Proactivity Backstage Future State Journey Map: Overview 11 5 Aware Onboard Build Manage Evolve Close 1 6 5 12 14 14 a 15 15 a 17 18 18a 19 19 a 19 a Chuck Business Mgmt + Sys Admin Adaline Dev + Sys Admin 2 6 7 8 9 3 3a 6a 4 4a 4b 4c 4d 11 11 11 11 11 3a 14 a 9 15 a 17 19 a > Search platform > Taxonomy Mgmt system > CMS > Forums > Support platform Full Ecosystem 6 7 8 9 117 8
  • 7.
    Line of Visibility Messages/Email Support Home Dashboard Services Store KEYTransparencyPrinciples: Contextual learning Semantic clarity Simplicity Proactivity Backstage Future State Journey Map: Detail 4a 4b 4c 6 5 4d 4. Armed with recommendations from the Cloud Readiness Check, Chuck has what he needs and thinks it makes sense to create an account. So he selects Get Started to start the workflow of establishing a Product account. a. He reviews the account levels and support package options presented to him and notices that the ones recommended are flagged and preselected. He can review all options listed by expanding contextual help icons for more details. b. He is prompted to add other users that will be able to access the account. Chuck, being an internal tenant and logged in to the network, has an initial view of everyone in his department to choose from and a quick lookup with autocomplete of any other user with Cloudco credentials. c. He can select multiple users to save as named groups which, along with lists of recent additions, will help to speed-up batch assignments to projects in the future. He can always edit his team in Account section or adjust per project. d. Before he submits the application, he is asked to confirm his email and sees an estimate of how long it will take for approval but, he can start to create placeholder projects in the meantime. He submits the application and gets a confirmation on-screen and via email. 5. He is quickly approved, indicated by an email and with an alert in the Messaging portion of the UI. He follows the link to the Dashboard. 6. Chuck has to sign in only once, because all regions and systems related to Product recognize his credentials. In the Dashboard, Chuck has a global view of all projects within an account, and can view, filter and edit by performance, billing and user status across regions. a. He remembers to add Adaline, who will configure the instances. He opens a User search tool while in the Product Dashboard to Search for Adaline (finds “Adaline” even though her name is “Adalina”) and drags her to the two projects. 4 > Metadata for User DB > User Preference DB > Consistent approval timeframes > In-context help content > Authentication > Live system status reporting > Live cost reporting Taxonomy system CMS Unified platform Development 6a Onboard Chuck Business Mgmt + Sys Admin
  • 8.
    Scenario Flagging Sara islooking for details on available window air conditioners from Store Sara just boarded the train and while grabbing an open seat, opens her iPhone and is desperately in search of a window air conditioner for her apartment. As she opens her Store app which has defaulted to her home store location. She types in the search box "air conditioner" which results in a list of varying products including air conditioners [multiple types] to hair conditioner. She is able to quickly filter by department and clicks home improvement. She is narrowed down to just air conditioners. She is presented one additional filter that allows her to filter by stand alone, window or other types of air conditioners. She filters by Window and receives six types of window air conditioners. Sara locates a window air conditioner and clicks on the result to go to a product detail page. There she is able to see a product image as well as color options. She sees details on how much space it will cool and knows that will cool her apartment. Sara reads the full description and then notices customer reviews and that the a/c unit she's looking at has an average rating of 4.5 out of 5. She also notices that there is a link to check availability. When she taps it she is able to see that there are no units available at her local store but she is provided additional area stores near her that have available stock as well as an option to have it shipped to her home. Sara decides that she will add one of the units to her cart found at the next closest store. Sara Goal Search for window air conditioner Context Using iPhone on public transportation Status: desperate Features (Product Detail) Default Home store Availability at home store Availability of stores nearby Option to ship Add to cart from another store Features (Optional) Customer reviews: summary and individual reviews Features (Search) Search results of varying products Filter by department, type of air conditioner (standalone, window, other) Product details: image, color options, specifications
  • 9.
    Scenario Task Flow ProductDetail Search Results Cart Search (in product context) Option 3 Option 1 Type “Air Conditioner” Sara Option 2 Scenario 3 Looking for details on available window air conditioners from Store See Page 3 Add to Cart In-stock Store list Make required selection (size, etc.) In stock? Review details YES NO Change to Home store for Order Floorplan Map Change store? NO YES Review Search contextual Result list (products) Filter by Dept. (Home Improvement) narrows to Air cond. Filter by Attribute (window) Review filtered Search Result list (6 products) Select Product to go to detail Change Search category (initiates targeted search)
  • 10.
    Rewards Notes 20.0a Mobile SearchInput Autocomplete in-progressSara Behavior of search criteria is dependent on the backend capabilities. Opens search input field Search input field Input persists until manually cleared or session ends Auto complete selections Displays category and # of results (if possible) 1.0 2.0 3.0 Cart Air _ Search Air Popped Popcorn in Grocery (3) Air Conditioners in Home Improvement (34) Air Filters in General Merchandise (18) Air Compressed in Office Supplies (2) Air Pump in General Merchandise (7) She types in the search box "air conditioner" which results in a list of varying products including air conditioners [multiple types] to hair conditioner. 1.0 2.0 3.0 Wireframe 1
  • 11.
    Rewards Notes Add to List Add to Cart L’Oreal HairConditioner $5.99 Reg. $6.49 Save $0.50 Honeywell Stand-alone Air Conditioner $114.99 Reg. $124.99 Save $10.00 Honeywell Window Air Conditioner $124.99 In-stock at Shadyside In-stock at Shadyside ••• ••• ••• Cart 20.2 Mobile Search Results: Cart Add item to cartSara Add to Cart ⁃ Animation of addition recommended ⁃ (default =add 1 to cart) Indication of # of items in cart (increments when items added from search result) Indication of # of items in cart (increments with each tap) 1.0 2.0 3.0 Add to Favorites In-stock at Shadyside 1.0 1 2.0 (34) Results for “Air Conditioner” Filters Price Low-High 1 3.0 Honeywell Window Air Conditioner $124.99 In-stock at Shadyside ••• Sara decides that she will add one of the units to her cart found at the next closest store. Wireframe 2
  • 12.
    Telling the WholeStory...the Macro and Micro Scenario Map: Needing Motivation Joe Context Joe graduated High School 10 years ago. He has been unemployed for 6 months and last worked for a local manufacturer and is considering taking classes. He finds out about the Map Your Future platform at a Community Center Kiosk More personal inquiry If enrolled in a school eventually, Joe can link his account to the one set up for him. This enables even further value with Advisor and academic progress input Career Map My JobsJobs Map Your Future Job Title City Salary Job Title City Salary Job Title City Salary Job Title City Salary Industrial EngineerCategories Add to My Jobs My Profile Industrial Engineer City Salary Filters more like this Local State All Skills Skills Skills Education Outlook Prospect A good fit LXP AXP Prefs Next Healthy Job growth Projected Summary Salary Career Map My JobsJobs Map Your Future Progress My Profile Classes Industrial Engineer Field Industrial Engineer Aerospace Engineer Electrical Engineer GRCC Industrial Enginee Skills Skills Skills Education Outlook Prospect A good fit LXP Healthy Job Summary Salary Remove Access Map Your Future: Wants to Investigate Careers and schools Skills Survey General Survey To discover life experiences that link to potential career paths ACADEMIC Create Account Selected school’s classes added to career map Pick target School Link to School Admissions info Learn what local jobs are ‘hot’ and also suited to reported life skills Learn about unfamiliar job titles and what skills are relevant through video interviews and discussions from other users CAREER Add Jobs to Career Map, see suggested classes What is an Industrial Engineer? Discussions Description Attributes Personalized Service Basic Service Add to My Jobs and view on Career Map Degree TBD 4 yrs Remaining 0% More like this
  • 13.
    Pros & Consof Omnigraffle Pro + 1. Easy and powerful Macro (diagramming) and Micro (wireframes) 2. Hard to lose stuff: Copy elements from autosaved points in the past! 3. Excellent multi-page PDF export, editable in Illustrator and vice-versa Con - 1. Doesn't match Illustrator for custom shapes or InDesign for text handling 2. Interactive prototyping is very basic and only in-app or PDF 3. Mac-only Grant Carmichael of The Understanding Group | @thinkxd

Editor's Notes

  • #2 Introduction and how I met Omnigraffle... Omnigraffle is a powerful and easy tool for creating high-level relationship diagrams, detailed task flows, mental models and wireframing that can be high or low fidelity - with basic interactivity for light prototyping Macro: Reframing research, getting at the “what” – Relationship/concept modeling, task flow diagramming, mental modeling Micro: Define the “how” – Wireframes
  • #3 Omnigraffle is a tool I use not just for wireframing but all along the TUG PASS Process, to follow a thread from research and understanding gained through analysis to mapping and modeling in synthesis to specifying how information is structured and plays out in wireframes.
  • #4 I don’t start wireframing without looking back at what we discovered and building models to visualize and understand the findings
  • #5 All that informs the Macro view, visually laying out what we observed in a journey map of the current state. To see how tasks play out over time and how users interact with each other and across channels. Flagging pain points.
  • #6 Zooming-in a bit, we can see how the current scenarios played out and what were the barriers that lead to a poor experience and misalignment with the business’s goals
  • #7 The Future state journey map responds to the goals and needs of the end users and identifies opportunities for the business. This is zoomed out.
  • #8 Zoomed-in a bit to the details of each step in the scenarios and across channels, we flagged principles that respond to the needs of the end users discovered during the analysis phase. This map also integrates a Service Blueprint, identifying backstage services that would need to be in place to support these interactions based on the key principles.
  • #9 Tying the thread from the research to the final product can be done implicitly or explicitly using OG. Here, the scenario has key points color-coded for emphasis that will be reprised in the wireframes.
  • #10 OG’s big strength is it’s easy diagramming tools. Lines stay attached and text is tied to each object if you need it to be. The tools are incredibly flexible and delightful abilities unfold with your reflexes. If a shape has multiple lines of text and even if each line is styled differently, the style can be applied to any shape containing text too. And if you make a mistake, the powerful versioning capability will enable you to go back to earlier versions, or just to cherry-pick one element on a layer on an old version to paste into the current one ala Time Machine.
  • #11 Here the color-coded portion of the scenario is emphasized to show how the current wireframe addresses the emphasized need
  • #13 Sometimes you need to tell a story by combining both wireframes and the context of a task flow – Omnigraffle handles this all with aplomb without a steep learning curve (as long as you have a Mac). Elements like Illustrator files (aside for a few hiccups with transparency) can be imported and editable in OG, and OG can export multi-page PDFs that are editable in Illustrator. PDFs can also have basic interactivity built in with OG too.