Animesh’s Takeaways What I learned: - The problem frame of onboarding that we redefined helped us understand the importance of doing problem framing in a proper manner - We realized that different team members have different perspective and that having a coherent understanding of the process needs to be really important when it comes to having a functional group. - Resolving team conflicts was one of the major learnings that I had with this project. - Jumping in with solution first approach is not the best method to explore a design prompt, sometimes we had to take a step back and relook at how we define the problem frame so that we get a better output. 39
Payoshni’s Takeaways There are varied types of qualitative data , and not all the qualitative data is relevant. - - Choosing data that is important and relevant to the design process and to discard the other - Design principles are not definite and meaningfully iterated - A good design is an amalgam of varied constructive ideas, however not all ideas are productive or feasible 40
Oliver’s Takeaways Throughout this project, I’ve learned: - Deduction will only get you so far – logic is helpful in certain scenarios, but adopting a collaborative, playful, and open-ended mindset will deliver more interesting results - Design is highly collaborative, so effective communication is a design skill in itself - Fast-paced, cheap solutions are more helpful in the long run than drawn-out concepts 41
Appendix 42
Appendix 01 User Stories 43
User stories For the user stories we drew from the diverse professional experience in our team. This gives us clarity and understanding of user problems Architect Journalist Developer Lucid charts help me to Lucid charts can aid us in Lucid charts enabled me to visually represent designs deconstructing complex systems design the structural workflow to clients and manage to give our management and of articles that helped in training projects effectively. design teams insights about new journalists. development process. 44
User Mapping 45
User Stories 46 Link to the diagram: https://drive.google.com/open?id=11M916m8d0Rrm0IgErDFLZWwv_rOymGE3
User Stories - What we did wrong Misunderstood user motivation as problem ● The problems illustrated were not simple, due to which ● there was no clear line of thought. The stories don’t correlate to our hypothesis well. ● 47
Appendix 02 Our Onboarding Experience 48
Our Onboarding Experience User gets locked out from adding shapes Large number of when the object count templates might limit is at maximum. It overwhelm the user, becomes a problem in when the user just the case of using a wants to use a blank templates. statement . Trial users get interrupted by paywalls which cause them to not convert into paid users. The search function and the feature find function does not behave according to user intentions, as the functions of both these buttons seems to be similar at first. The feature find’s location is not easily visible. 49
OUR ONBOARDING PAIN POINTS Confusion managing text with other elements No status of Ambiguous writing, onboarding progress unclear expectations Fast transitions Difficulty entering text No BACK button within objects 50
Insights from onboarding experience 51
Appendix 03 Research Methodology & Questions 52
Research Methods 53
Sample Interview Script 1. What do you mainly use Lucidchart for? 2. What other software do you use ? What do you like about them? 3. Can you tell us what you like about this software? 4. What feature did you find most helpful in your task? 5. What has been your best diagramming experience till now? 6. What was a frustrating moment in this experience? How would you want to do it ideally? 7. Did you have a problem with lines, circles ? (and other pain-points from the data given by Lucid)’ 8. Do you work in a team environment? In what capacity do you contribute to diagramming in a team? 54
Task-based interview Diagram the venn diagram of common interests between you and your friends and your family ● Understanding shape manipulation, template use and how people use lines, borders, and colors ○ to differentiate shapes Diagram a flow chart of how would you turn on a computer ● Understand the use of lines and shapes, if the use of flowchart shapes is clear ○ If the user can manipulate the diagram elements easily ○ Create a new account and diagram a simple mind-map ● Understand the onboarding experience of the user ○ Understand how efficiently can a novice user diagram ○ Make an entity relation diagram for a website ● Understand how a intermediate user uses an interface to diagram a complex entity relationship ○ diagram 55
Why we followed this methodology? Onboarding (SEE) / Have the participant think out loud while going through the onboarding process What are your first impressions of this website? ● Was anything frustrating or confusing? ● What are your first impressions of this website?(after onboarding process) ● What did you encounter during onboarding? ● What caught your attention during onboarding? Was anything frustrating or confusing? ● Do you read the comment on the loading page ● Why did we do this? To get an idea about the relationships/metaphors the user forms while interacting with the software 56
Why we followed this methodology? Usability (DO) Go to task-based questions below about mind map Anything else the user wanted to play with Why did we do this? To comprehend the user’s process, view his frustration and sense why is he frustrated even while doing the most basic things like drawing shapes, arrows, etc. 57
Why we followed this methodology? Reflection (Feel) How regularly do you see yourself using this product? (for a week, month, semester etc.) why? Do you see yourself using LucidChart to collaborate on projects like you would with Google Docs or a similar tool? Why did we do this? To see if the user liked the software, if he would come back, if the overall experience was good, and why was it good? To understand if the user’s process has changed across time and other constraints. Why is not onboarding process engaging enough? 58
Why we followed this methodology? Information Architecture (THINK) Can you access the tools you needed to make your diagram? ● Let me watch what you would do to find help or tutorial information. ● Do you think the tools in the sidebar are organized well for what you want to do? ● Do any elements or icons not make sense on the toolbar? ● Why did we do this? To understand how the user interacts with icons, is he able to bring prior knowledge of diagramming to the software. Is he able to understand what the icons mean in one go or he takes time to get used to the shapes, arrows and is he able to ascertain basic usability of the icons? One of the goals was also to understand if the user accesses the help option. 59
Appendix 04 Research Findings 60
Quotes from the interviews “I skipped tutorials because I like learning on the go and the tutorial bored me” “I identify as a software engineer and a ux designer” (When the interface asked to choose who the user is, “teacher, student, etc) “These paywall pop-ups are very annoying and they are hiding the interface” “Since it knows I am making a Venn diagram, it should help me” “It’s like a power-point but nicer” “I don’t want to use all of it’s features, but I'm okay getting what they are providing in the free tier” “Assuming I knew what I was diagramming, I would use a blank document ” 61
General Findings Accessibility for colorblind users is a new consideration ● Most people use blank templates when they already have a mental model of what they want to ● diagram It is rare that people read pop-ups when they have a task to perform ● Some Engineers we interviewed like the Lucidchart’s interface. ● Users find it comfortable because of its similarity to microsoft office. ● When non popular products like Venn diagram, equations, etc are selected understanding the basic ● tool set like arrows, shapes, process-related shapes is an issue. 62
Appendix 05 Analysis of Data 63
NPS Data Promoters Passive Detrators We categorized the NPS data to understand the plus and pain points of users. This was done searching keywords in the data. 64
Quantitative Data Areas highlighted in orange show that ● basic tool set (shapes, lines & text ) are hard to learn . The same problems (shapes, lines & text) ● persist even after 3-6 months of usage. 65
Quantitative Data The highlighted portions of the graph show that when users upgrade in usage levels there is better retention. 66
Insights from Data Analysis 67
Appendix 06 Our Journey 68
Our Design Rationale 69
Our Design Journey Initial Reiterated 70
What We Did Differently Interview Group activity Reverse thinking Methodologies - The first methodology - Dedicating time to play with - Solutions were explored focused on emotional the software every week to during discussions which experiences and gain newer insights went tangential expressions. - Reiterating the user stories - We worked backwards - The second focused on as we progressed (and arranged our slides user tasks to understand accordingly) to usability problems. understand the crux of the problem we are solving. 71
Where We Went Wrong Incorrect Dead End Analyses Hypotheses - “Loyal user bases generate - Competitive analysis more collaborators and - SWOT analysis creators.” - Combined user-stories - “Premium users don’t find and user-journeys value in the product due to a - User mapping (we tried lack of tools.” to specify a target - Making the learning curve audience) “less steep” will lead to easier onboarding - Making tools more usable will make onboarding more digestible 72
What We’ve Learned It's difficult to understand user It became difficult to understand Many questions we asked felt experience problems with the user experience by asking like they led participants down usability problems arising first ’how do you feel using this tool’ as a certain line of thought it made participants feel uncomfortable 73
Appendix 07 1 HYPOTHESIS: After synthesis of our data we inferred that users are more willing to pay for premium features if they can successfully complete their diagramming process without being interrupted by the paywall 74
Problem illustration ‘I’m not sure why this pop-up came up, I just wanted to add a new shape to the template’ Free users get interrupted by paywalls when they add more that 60 objects 75
Problem illustration The elements responsible for object count not mentioned ex: the youtube tutorial When 60 objects are Youtube tutorial added to the shown is 20 canvas free objects which is users are not never able to access communicated the shape to the user. toolbar. 76
Reason for Inclusion Not able to communicate about premium features When adding For free users Free user is No clear extra shapes templates with taken back to the communication reached the limit more than 60 paywall and on which of 60 objects and objects can be unable to templates are stopped from loaded onto the diagram premium diagraming canvas. 77
Appendix 08 2 HYPOTHESIS: Users expectation of intuitiveness is based on previous interactions with softwares. Lucidchart should try to understand this and cater to it by creating its tool more contextual to it. 78
The icons highlighted are not easily noticeable especially the feature find Most of the tab is similar to microsoft office while the Though the overflow highlighted options are not menu looks similar to similar and are too close to these microsoft the options options confusing the users provided are not. 79
I expected the overflow menu to work exactly like microsoft office, no wonder I couldn’t find the arrange option 80
Reason for Inclusion Users are confused because The interface is Making tools Look and feel of bloated with too more contextual the interface is many options will help reduce similar to and tools not the effort to microsoft behaving in teach tools and powerpoint similar manner features 81
Design Exemplars: Contextual Tools A kitchen table serves multiple purposes: meals, work, etc.. The elements needed for each activity are introduced contextually, with the blank tabletop staying the same. We noted the benefits of context-specific tools We then thought about how context-sensitive, intelligent user interface tools such as Microsoft Office Assistant (Clippy) can help, teach, and potentially annoy users. 82
Appendix 09 3 HYPOTHESIS: We believe new users will be retained if the they can successfully achieve diagramming by learning the tools faster and efficiently with the help of interactive learning. 83
Reason for Inclusion From the quantitative data Users have Problems with Users continue trouble learning basic tool set to have issues basic tool set like persist even with help and shape, lines, after 3-6 months feature find adding colour. 84
Design Exemplar: Interactive Tutorials The 44th Anniversary of the Birth of Hip Hop google doodle is a great example of how you can teach a user how to use the interface in a quick The hovering effect and efficient manner. used in Photoshop acts as a “revision” for novice users Link : https://www.google.com/doodles/44th-anniversary-of-the-birth-of-hip-hop 85
Introduction The following concepts are detached from the hypotheses and user stories outlined above We performed these exercises assuming that usability was not a concern, in order to explore higher-level user experience concerns 86
Process Personas - We created several “edge case” personas to outline extreme examples “What if…” - We brainstormed ways that Lucidchart could be redesigned for future-facing, unconventional situations Concepts - Each of us brought together points from the above activities to create novel design concepts 87
Appendix 10 Personas 88
Daffy Duck Influencing Factors: - Short-tempered personality - Accessibility concerns (manual, voice) - Familiarity with technology Daffy Duck, 82 years old, Uncle Obstacles Needs - His feathery hands make it difficult to use a - Brainstorm gift ideas for his nephew mouse and keyboard - He needs Lucidchart to address - His lateral lisp makes voice interactions accessibility and usability concerns more difficult 89 Image source: cartoonbucket.com
Samantha Influencing Factors: - Highly driven personality - Family time constraints - High desire for efficiency and value Samantha, 39 years old, Entrepreneur, Mother Needs Obstacles - Visualize the long and short-term - She has many demands on her time and energy strategy for her business - She has a low tolerance for ambiguity, and is - She needs Lucidchart to be easy to willing to shop around until she finds the right tool learn in as little time as possible 90 Image source: mostvaluablenetwork.com
Robert Influencing Factors: - Factors that influence behaviour such as Larger-than-life personality - No manager demographic - Lack of money Robert, 27 years old, Musician Obstacles Needs - He has very little structure and needs guidance - Visualize his band’s tour requirements: Needs, Obstacles Design - He can only use the free version until he supplies, venues, hotels, schedule becomes famous - Share the plan with band mates 91 Image source: clipartkid.com
Appendix 11 What-If ‘Lucidchart’ was.... 92
Redesigned for Smart Cities Display charts in public Google maps and Lucidchart Google Maps Nested view of the city. places to build community, partner and make a diagram Creating a route specific to Where you can move share history, show of the city highlighting areas the user and their between different layers of schedules where riots are happening understanding. detailed view Illustrate mail routes, repair An AI interface embedded in Illustrating routes in the Pipeline connectors to show schedules for citizens Lucidchart and Google maps form of diagrams. flow of data(Diagramming Show personal mind maps on that predicts the user’s day This will be helpful in places with spatial and temporal shared display surfaces, and moods and gives where in the routes are component ) show your status, schedule, suggestions to visit coffee complicated mood shops,bars etc through a mood board or mindmap 93
Redesigned for Smart Cities Takeaways and Insights - Lucidchart can pan into a wide range of audience and that audience can want to diagram anything. For eg, right now there are no templates for environmentalists, doctors, nurses, smart city planners, lawyers etc. 94
Redesigned for Video Games Diagramming personal Having a “mario” like game To have a tutorial of a game A fun ending screen which gaming history, to share for teams before they begin in Lucidchart. gives a sense of in-game progress like to collaborate on high accomplishment and rankings and achievement priority projects to inspire To create cheat sheets with satisfaction trust among the team and Lucidcharts. Make associations and build reduce stress Just in time tutorials like comfort for younger user To use Lucidchart as a game. Monster Hunter base A theme based usage of Lucidchart. For eg, if the user Gamification of tutorials selects ‘Harry Potter theme’ he will get everything except Mapping shortcuts to a the essential tools in that radial wheel for easy access theme and he will be more engaged Diagramming to make levels for video games 95
Redesigned for Video Games ● Understanding games through diagramming. ● Looking at lucid charts to help create a game ● If Lucidchart can have achievement medals or such symbolism to inspire users to finish their diagrams then users will feel a sense of accomplishment. ● If there is game format of going through a tutorial rather than a simple video, the user will be more engaged in the learning process which lead to a better diagramming process which will lead to the user feeling more confident in himself. 96
Appendix 12 Concepts 97
Concept 1 Public Display Mind Map - Ambient, public data visualization - Can display a person’s schedule, mood, activities - Can set status to do not disturb - Projected on public surfaces (smart walls) 98
Concept 1 Design Principles Ambient as opposed to interactive visualizations Sharing timelines, schedules and personal details in social situations Changes to interactivity status bridging non-verbal (visual) communication gaps 99
Concept 2 100
Recommend
More recommend
