UX Clinic - Nearsoft · community. Using different design methods, our aim is to facilitate...

© Nearsoft, Inc. All rights reserved.theuxclinic.com

Case Study:Crowdswell

Design Team:Marysol OrtegaDiana ArvayoMiguel MedinaMisael León

Prepared by:Marysol Ortega & Misael León

UX Clinic Business Origami+Journey Maps


The UX Clinic is an initiative made to share our design expertise with the software development community. Using different design methods, our aim is to facilitate planning, exploration, concept generation, early prototype iteration, evaluation, and refinement of websites and applications submitted to our program.

Each edition of the UX Clinic culminates in a 25 minute-long episode via Hangout On Air (HOA). We broadcast our process and recommendations for a new case study every three weeks. This report is the final outcome of an analysis we have made for the fifth episode’s case study

This report compounds findings resulting from Business Origami, a design method where data is collected from potential users in a workshop session. This inspired us to create new concepts and prototypes for Crowdswell —our case study.

UX Clinic Business Origami + Journey Maps

http://www.crowdswell.com



a. Case Study: Crowdswellb. Preliminary Analysis: SWOT Analysis / Benchmarkingc. Design Strategy: Business Origami + Journey Map 1. UX Strategy Blueprintd. Business Origami + Journey Map: Our Process 1. Toolkit 2. Workshop 3. Journey Map 4. User Journeye. Business Origami + Journey Map: Results 1. Dashboard 2. Branding & Logo Section 3. Time & Goal 4. Story & Video 5. The Swellf. Conclusions

UX Clinic Content


Crowdswell is an online community to crowdfund social innovation initiatives for civic good. Users can find a tool to promote their activist vein and put it to work. It allows them to find a community that shares the same dedication to social change.

The company is based on the idea that there’s a lot of good in the world along with a lot of problems that need to be solved. One person can’t do it all, but they can certainly start a chain reaction and group people around a common concern. Thus creating an engine for community development.

The site works as a fundraising platform where people post a social problem that needs to be addressed, then the audience can invest money

Case Study Crowdswell

if they feel related to the cause. Once the Swell (as the campaign is called) gets enough support, someone from the public offers to tackle the job needed to solve that problem per the amount of funds raised.



Case Study Crowdswell


Prior to selecting a design method, we made SWOT analysis of Crowdswell and its competitors. SWOT analysis stands for an evaluation of Strengths, Weaknesses, Opportunities, and Threats that affects the service.

During this preliminary assessment we noticed its website has an attractive aesthetic concept. The design is strong and visually cohesive, but the process of creating a campaign, a Swell, is not intuitive and it gives the impression of complexity. In other words, too much work is required to complete the process.

We went over the main competitors’ sites to compare the process of creating campaigns and contrast the differences.

PreliminaryAnalysis SWOT & Benchmarking

FundlyIndiegogoRallyKickstarterCrowdfounder

http://www.fundly.comhttp://www.indiegogo.comhttp://www.rally.orghttp://www.kickstarter.comhttp://www.crowdfunder.com

12345


PRELIMINARY ANALYSIS SWOT Analysis / Benchmarking

SWOT MatrixHELPFUL HURTFUL

Strengths WeaknessesINTERNAL Advantages the competition does not have Characteristics that are at a disadvantage

Characteristicsof the website

* Navigation is quick and simple

* Feedback error is well done

* Clean modern design, really appealing forthe millennial target audience

* Instructions are easy to follow(makes it look simple)

* Introductory video is helpful to easyunderstand what the site is about

* Full mobile version support

* The onboarding process is difficult to follow.Key information is scattered in severalsections.

* Color code is confusing

* The process of posting a Swell is in cascademode, there's no progressive disclosure

* Uses a HTML text editor to start the Swell

* Hard to get the idea of how to make asucccesful Swell

* Beyond getting the funds, there's theimpression of lots of work to be doneafterwards (getting someone to take the jpb, verifying it, work with goverment,getting permits, etc)

Opportunities ThreatsEXTERNAL Factors that can aid in reaching a goal Factors that can harm the site functionality

and performance or hinder company's goal

Characteristicsof the

environmentand competitors

* More groups use crowdfunding to supportinnovation challenges to solve complex, social problems

* The link between online networking andsocial action is getting stronger

* Crowdfunding removes the participation ofthird parties, thus is perceived as a greatopportunity to help others without theparticipation of burocratic organizations

* The crowdfunding industry is alreadygrowing rapidly, and as that growthaccelerates, several crowdfunding nichesare expected to really take off

* Increased popularity of local, crowdfundingcommunities

* Indiegogo has a great guide to make asuccesful campaign

* Indiegogo has a clear step-by-step processof starting a campaign

* Competitors have sharp visual design andstrong imagery

* The popularization of crowdfunding is on therise. There are more options to choose from,more competitors

* Crowdfunding is not well regulated yet,some people might lose money in fraudulentcampaigns. It might lose credibility in thefuture if bad experiences are documented


After interpreting the results from the SWOT analysis, we wanted to generate an easier way to create a Swell. The team decided to use Business Origami and Journey Maps as a way to answer strategic questions regarding how to improve the initial process so it could reflect the potential users’ real needs in a better way.

Due to its qualitative nature, Business Origami provides deep insights into human behavior. Including the reasons that govern such conduct, and especially the emotional spectrum experienced during any given scenario.

UX Strategy Blueprint

We used the following UX Strategy Blueprint to establish a focus point while applying the method:

Challenges ~ The group of sites we benchmarked as reference for our study shared the same kind of task flow to create a campaign. So at a first glimpse, it would be impossible to define the best way to design the process and what the most important attributes are for our own Crowdswell’s design iteration.

Aspirations ~ By applying Business Origami we expected to overcome the challenge of determining the best way to reduce a complex process, such as running a social campaign. We intended to make a simplified and friendly task flow that is easy to complete and at the same time, accounts for the needs and expectations users have when running an online campaign.

Focus Areas ~We analyzed three key areas to running a social campaign: a) The recruitment process of donors and volunteers, b) The communication strategy, c) How information is displayed. We wanted to discern the most common barriers activists face during theprocess of

Design Strategy Business Origami

funding a social cause and how we could translate those into opportunities when designing our recommended task flow.

Guiding Principles ~ By translating users’ subjective emotional responses into a well-defined map of the journey they undergo when running a campaign we would be able to facilitate a rich groundwork to generate the ideal process of creating a Swell so that it reflects what they need.

Activities ~ For Crowdswell we conducted a workshop with seven potential users who usually are into social activism. We gave them predefined activities and tools so they could narrate their own story. Later on, we translate those insights into a Journey Map that indicates the touchpoints of their quest.

Measurements ~ Once we collected the users’ insights from the workshop we were able to translate them into specific features and attributes. Fostering an improved task completion and an increase in user satisfaction.


Business Origami+ Journey Map

Our Process

1. Toolkit

Business Origami is a powerful research method for modeling and understanding complex services.It helps to envision the story of how users experience a service. Making emphasis on key touchpoints during the interaction.

Since this a hands-on tangible artifacts method, it is easy for everyone to contribute without requiring diagramming skills or following any flowchart conventions.

The outcome is a miniature set with a physical representation of actors, objects and environments and how they relate to each other in a story. Its strength comes from the direct participation of potential users.


The participants narrated their story highlighting:

The recurring actors on their quest. Such as organizations, personas, institutions, spaces, environments, etcThe communication tools they regularly use when reaching to each of the actorsThe common interactions between people and organizations, and the environmentThe value exchanged during those interactions, what they got and they gave in returnedThe obstacles and barriers they encounter during the process. By asking them to envision the removal of those hindrances we let them imagine and easily describe the ideal scenario to reach their goals.

The origami component of the name comes from the use of paper cut-outs representing people, buildings, vehicles, computers and, other technology and communication tools.

We placed those tokens on a horizontal whiteboard and asked the participants to recreate their own process of gathering funds to solve a social issue. This produced a miniature model of the journey.

We set up a workshop with 7 potential users in order to understand the general process of non-profit organizations and people that require funding. Understanding their journey was key to generate a design proposal.

u

v

w

x

y

Our Process

2. Workshop

BUSINESS ORIGAMI + JOURNEY MAP


In order to visually organize the results found during research we created a user journey map. This diagram describes and illustrates the transition from one touchpoint to another. Including the interactions that took place during the process, the information exchanged, and the users’ expectations in every specific scenario.

This kind of visualization enabled us to improve the user experience meanwhile documenting their usual journey of launching a social campaign helping us identify areas of improvement moving forward.

Our ProcessBUSINESS ORIGAMI + JOURNEY MAP

3. Journey Map


Stages Recruitment CallIdeation Fund Request

Activities

Communication

Actors

Value Exchange

Barriers

Opportunities

Ideal Scenario

SubjectiveExperience

Actioning

• Detection of social issues• Census of needs and requirements• Solution ideation and analysis

• Post in FB page• Flyers• Whatsapp and phone calls• e-mails

• Shout out for help to friends and general audience• Generation of online content

• Meetings with organizations• Manage public sector petitions to join• Manage resources• Organize campaign execution

• Organize the actual solution process• Distribution of resources• Execution of the solution plan

• Online tools• Tangible items• Transport vehicles

• Committee• Volunteer networks• Public• Affected social sector

• Committee• Volunteer networks• Public• Affected social sector

• Lack of help• Mistrust / Wrong public perception

• Give updates of the work in progress• People want to help aside from only donating money

• Multidisciplinary network approach• People trust if evidence is shown

• Friends• Colleagues• Private Organizations• Public Sector

• Expressed commitment• Share• Like• �ew members of the network

• Only online activity withouth commitment in real life• Public is not informed on time

• People do as they say• Show reality as is and society will respond immediately

• Straight-forward explanation of reality as is• Sensibilize audience• Create strong emotional connection

Sense of belonging

�� need people to see the reality of the situation we�re trying to solve�

Patience

�� ou can�t force anybody to help� you can�t tell them what to do�

• Documents/Paperwork• FB post• e-mails � phone calls• Fundraising events

• Funds/Money• Tangible goods• Working hands

• Lack of tools to better communicate the campaign• Public sector intentions to take on existing campaigns

• Lack of tools to effectively communicate the campaign• Public sector intentions to take on existing campaigns

• Documents• e-mails• Online Social �etworks

• Committee• Vulnerable social sectors• �etwork of volunteers

• List of needs• Documentation• Evidence �pictures� videos� testimonials�• Action plan

• �ot knowing how to present story• �ot having the proper tools• Problem requires legislation• Lack of know-how and organization

• People to commit with cause when explained• �esources will come in abundance

• Communicate a clear value proposition

Eagerness to help

�� want to help but � need help from others�

People needs to feel identified with a causein order to help. Empathy is key to persuasion

People don’t want to be forced to help socialcauses, they need feel emotional connection

Networking and strategic communication is key for non-profit organizations to succeed

Public perception of non-profits is proportionalto how professional they are perceived to be

Guiding Principles

3. Journey Map



Small organizations struggle for a chance. The public sector is taking on already organized projects

Organizations and their campaigns are not taken seriously unless they're perceived to be well organized and stable

Wrong social perception on what non-profit organizations do

Key InsightsLack of audience's commitment. Participants identified two different ways to encourage commitment depending on the actors they target:

a) Individuals: Raise awareness showing them the causes' reality, what they personally feel about the initiative, and by awakening altruismb) Private Sector: Showing formality in the organization

Enhance recruitment trust. Connect with people at an emotional level to create a sense of belonging

Professionalization is required. Improve the organizational scheme of the group, defining objectives.

a) Create a network of volunteersb) Fight rejectionc) Dare to do more

u

v

w

x

y

z


3. Journey Map


Project stability and formality through a strong visual identity

Show the problem’s full spectrum. Presenting both the background and the desired solution to the situation

The process of creating a Swell and the campaign itself should be able to:

Make the audience cross the bridge from a simple social activity like liking on sharing to real action

Raise awareness through the development of an emotional connection and a sense of belonging

We used these findings to define the best way a user can create a Swell. Reflecting their needs and specially tackling the obstacles they find in their journey.

INFORMATION ACCESS

USE

R TA

SK F

LOW

: I W

ANT

TO C

REAT

E A

SWEL

L

TOUCHPOINT EXPECTATIONS

Login

Create a succesful online campaign

Choose dates in calendar

Set money goal

Sign-U p

Explain Y our Swell

Star t aSwel l

Time andGoal

Tell YourStory

Deliverable(Objective)

How ca npeople help?

Save and Exit/Launch

Who is involved?(Team member s

& volunteers)

Other ways to hel p

Who willfix it?

Communicate stability and formalit yof my organization in order to build trust

Create a realistic and yet sufficien tenough money goa l

Communicate a sense of urgenc ywithout pushing peopl e

Create empathy and connect with peopl eat an emotional level

Show the aftermath and reinforce thelogic framework

Create a sense of belonging and broadenthe network exten t

Credential s

Title Summar y+ taglin e

Visual

Identity(logotype)

Upload/Creat ea vide o

What ’s the problem?(Issue description)

How it used to be?(Background )

How we want it to be?(Solution proposal )


u w

v x

4. User Journey


The current workflow is one single cascade task that gives the illusion of being a cumbersome process to complete.

After a brainstorming session we generated a graphic representation of a task flow that accounted for the concluded takeaways. See next page.

Current task flow for creating a Swell

Business Origami+ Journey Map

Results


We recommend displaying the information using a dashboard approach, emulating a storyboard. This way we can adopt an strategy of incremental progression prompting the users to complete the process one step at the time.

ResultsBUSINESS ORIGAMI + JOURNEY MAP

1. DashboardGiving the illusion of being very simple and short. Implementing this alternative the users will feel they have complete control over the task.


Content by section:1. My swell

a. Titleb. Summaryc. Map

2. Logo & Brandinga. Organization nameb. Websitec. Taglined. Logoe. Toolbox logo

3. Time & Goala. Initial date of the Swellb. End date of the Swellc. Desired money goald. Currency

4. Story & Videoa. State of the current situation + Imagesb. Problem’s background + Imagesc. Images for each stated. Video URLe. Video recording widget

5. Desired Outcomea. Key deliverablesb. Expected scenarioc. Achievements

6. The Teama. Name b. Picturec. Role in the teamd. Social network handlee. Connect with FB to find out who of your

friends are helping

7. Who can take on this Swell?a. Myselfb. (Breakdown plan: Risks and Challenge,

Qualifications, Perks for Supporters)c. Vetted usersd. Marketplace

The dashboard showing the progress made:

8. Other ways to helpa. Sharingb. Volunteeringc. Tangible goods (Specify)

How It Works:Users click on each one of the section boxes and then a window on top will appear.Then they focus only on filling out that part of the processOnce the user completes each piece of the story, this will be greyed out and checked with a green iconA bar at the bottom will indicate the progress made, as users move forward on the dashboard they’ll complete the information little by little. This is called Progressive disclosure working one step at the time to complete a long and complex process.


1. Dashboard

u

v

w

x



1. Branding & LogoThe aim of this section is to include as much information of the organization as possible to present them with a more professional branding.

The Visual identity of an organization is mandatory, so we recommend having a simple toolbox to generate their own logo in case it’s not available already.


This is just a clever way to present the request for the time limit and the money goal of the campaign. Within each modal window the user will be asked to complete the information needed. Making sure they finish this piece before moving forward.


2. Time & Goal


This part is very important because here users get to tell their story from three specific perspectives: a) The current state of the situation, b) the background in context and, c) the desired outcome of the solution

And what greater way to achieve them other than allowing their story to be told. The human brain is wired for storytelling, that’s the best way we process information. A story, if broken down into the simplest form, is a connection of cause and effect. Whenever we hear a one, we relate it to an existing experience.


3. Story & VideoThat’s why we should encourage users to upload a video explaining the situation: why they want to fix it and how they’re planning to do so.

If they don’t have a video they will be able to record their own on this very same screen.


Above the fold the key information of the Swell must be presented:

1. On the left part we have the logo of the organization, so the audience can have a feeling of formality and reliability.

2. On the right part we added a timer with days, hours and minutes left to finish the campaign to create a sense of urgency to the user.

After completing the dashboard process, the user will be able to see a preview of their Swell before launching it as final.


This is our recommendation of how the actual post of a completed Swell could look:

4. The Swell

3. To create empathy and sensibilize the public we are giving the video a major role in the Swell. By doing so, we are trying to foster emotional connection, carrying people from a simple “like” or share into a real action.


Below the video, the user will find the story behind this campaign in three simple steps:

1. The Problem: A big gallery of the current situation will be displayed., Based on the feedback of our participants, they want to show the whole picture to potential backers, and encourage them to take action without the intention of making them feel sorry or guilty.


4. The Swell

2. How it used to be: This part will show the user the situation before the problem existed. These images will help the user to visualize the main goal of the Swell.

3. How We Want It: Their ideal scenario once the problem is eradicated.


To wrap things up the Swell should display the following information:

1. Other Ways To Help: The user will see alternative ways to join the campaign beyond donation. Maybe by donating clothing, shoes, or something else the team could translate into different ways of getting involved.


4. The Swell

2. The Team: And finally, we have the team members with the name, photo and user account, or e-mail to connect the user by different channels with them. The aim of this part is to make the users feel they’re part of something bigger, a movement they can be proud to be a part of.


Outcomes Summary:Dashboard to complete the process in form of storytellingProgressive disclosure. One step at the time gives the illusion of a short processVisual identity is mandatory. Make a toolbox to generate their own logoStorytelling through video. Give users the tools to create their ownBreak the problem to fix into small chunks of information for a more effective communication

By going from a broad appreciation of the process of launching a campaign for social good, to a more precise summary of barriers and obstacles they face, we were able to design a task flow that accounts more fairly to the needs they expressed during the workshop.

Final RecommendationsConclusions

u

v

w

y

x

Final Takeaways:By presenting the process of creating a Swell as a storyboard we facilitate its completion, because users process information better when it's told in form of a storyPeople want to connect to social causes. By creating a sense of belonging the campaign has better chances of succeedingEncourage users to tell their story using video because it's great to building trustVisual identity is important to project stability and formalityPresenting the problem's background and desired outcome simplifies the summary

The next step would be for Crowdswell to translate their journey user go through when they launch a fundraising campaign and transform the obstacles and hindrances they find along the way into an effective storytelling strategy.

When we are designing a product, our users have all the answers we need to create amazing experiences. This is why placing them at the center of the design process is key for outstanding results.

u

v

w

y

x

What's Next?


Get started on making UX part of your best practices and obtain useful insights from the feedback and usability recommendations our panel will be giving.

Submit your app or website or watch our latest episode:

theuxclinic.com

Apply For Our Initiative

http://theuxclinic.com

Date post:	01-Oct-2018
Category:	Documents
Upload:	doannhan
View:	214 times
Download:	0 times