Helping Changemakers in Atlantic Canada discover new paths to achieve positive social change.
By OLUSEGUN OSUNRINDE 2/08/2021
Overview
Wayside Learning Community is an online platform for anyone working for the greater good in Atlantic Canada to connect and recharge, collaborate, learn, and discover new paths to achieve positive social change.
Problem Statement
Inspiring Communities acquired a charity organization that owns an online learning platform. The challenge was to redesign the platform to look new, fresh, and user-friendly with its own unique brand identity that depicts its a different entity but an affiliate of the Inspiring Communities brand and develop the platform to respond to the outcomes of a field research carried out by WeavEast fellows in 2019.
Users & Audience
Our users are participants, supporters, contributors and changemakers in Atlantic Canada working for the greater good. User personas definition are as a result of the outcomes of the field research carried out by WeavEast fellows in 2019 with the support of a backbone team from Inspiring Communities, of which I was the communications coordinator. Source: weaveast
- Participants: Those doing important work in communities but not yet working regionally, or able to contribute to work focused on systems change because their attention is focused on the survival of specific programs or services for their clients.
- Supporters: People who recognize injustice in the systems around them, even when those systems are serving them just fine.
- Contributors: Those who are determined to move to action; personally and/or organizationally ready to begin taking part in change making work.
- Change makers: People who are well past thinking and are fully invested in doing. They have chosen a strategy, and are taking action and are willing to experiment when the path is unclear.
Roles & Responsibilities
I played the role of Communications Coordinator during the WeavEast fellowship research then later became the Online Animator (Product Design and Technical Support) amongst an in-house team of a Project Manager, an Evaluator, and a Content curator. I supported the WeavEast Fellowship research process and was responsible for the user journey mapping, wireframing, Prototyping, UI/UX, branding, ongoing technical support and maintenance of the design system and I supported the user research process.
My part required me to drive clarity on the product with the Wayside team by developing and presenting high fidelity prototypes with results from a focus group of testers and rally the organization in the right direction by working with the contracted software developer on the technical product requirements. We worked remotely for most of the product development, about 85% of the total period.
Scope & Constraints
Wayside previously launched in 2018 before it came to Inspiring Communities in 2020. Prior to Wayside acquisition, Inspiring communities embarked on a fellowship program with a geographically diverse community called Weaveast in 2019 in order to identify the most impactful services, resources and programs that can be provided for Changemakers over the next few years.
The Wayside redevelopment commenced in April 2020 at the beginning of the pandemic with just me working with a project manager and a web developer remotely. Throughout the product development, the project manager was changed three times. The team later grew with additional members - the evaluator, content curator, and an expert on adult education/training. This product was developed with an agile process, an iterative approach. There were three product design iterations throughout the product development cycle.
Process & What I Did
Field Data Research
With communications support provided by me, WeavEast fellows were engaged in storytelling, ecosystem mapping, and community engagements to source first-hand, first-voice information from communities across Atlantic Canada.
Their Needs
Insights from the WeavEast fellowship revealed the need to connect changemakers across Atlantic Canada for the purpose of finding their way into shared practice, learning from each other and providing support for what’s working well and for what’s challenging the ecosystem.
Adopting the Inspiring Communities Brand for Wayside
Logo
The Inspiring Communities logo inspired a concept for the logo.
I added the inspiring communities arrows to the ‘I’ in Wayside as in Inspiring communities logo, fusing the indicators of different colours and the dot, showing that Wayside is the place to connect and convene with a geographically diverse community of support for change-making activities. The wordmark logo has a cool geometric sans-serif font for an elegant and modern look with a minimalistic road path drawing with the tail of the ‘y’ in Wayside, depicting that Wayside is the path to learn and explore as a changemaker.
Colour
Shades of blue and yellow were selected to represent the brand.
Credible, Social and fresh energy is the fill I was going for, and these colours perfectly express all these emotions.
Design
User Flow
To make sure that we create the closest possible solution to the Wayside problem statement, I understood whom I was designing the platform for. Identifying the users persona on the platform made it easy for me to outline the steps that a user has to take on Wayside to achieve their goal.
- Use Case 1 (Participants, Supporters, Contributors, Changemakers): This user comes to Wayside to join a conversation with their group.
- Use Case 2 (Participants, Supporters, Contributors, Changemakers): This user comes to Wayside to join a conversation on topics they find interesting.
- Use Case 3 (Participants, Supporters, Changemakers): This user comes to the platform to take a course and can discuss course-related topics with other learners enrolled in the same class.
- Use Case 4 (Participants, Supporters, Changemakers): Every user can access resources and blogs. However, we may have some users that will only visit the platform for blogs and resources.
- Use Case 5 (Contributors): This user wants to contribute to the resources and blogs section or develop a course on Wayside.
Wireframe Map
Through the user flow, I prioritized the users’ actions on the platform and used it to create a sitemap. The wireframe map is an organizational structure that’s similar to the sitemap but a closer representation of the future UI experience. They are essential stepping stones to user interface design. I presented them to the team to review the layout, content hierarchy and navigation of Wayside Learning Community.
High-Fidelity Prototype
After approval of the wireframes, I went on to design a high-fidelity prototype of the minimum viable product to give my team and the stakeholders an insight into what Wayside would look like in its final form and also get full approval before the software developer begins work on bringing the product design to life.
Mobile and Web Design
My design development starts with mobile-first, then web interface.
Groups Feature
Wayside's group feature allows for private group and public conversations.
Group Discussion UI
This is what a typical group on Wayside looks like. There is a feed for group conversations only and users are able to nest their photos and documents in different tabs.
Courses
When you take a course on Wayside you are able to track your learning progress and connect with other course participants in a discussion group.
Home / Activity Timeline
A user can track conversations going on in their subscribed groups, create a post or event to the network or a subscribed group and filter their timeline to show personal content, newest content or all the content.
Blog Feature
Wayside's blog allows users to see number of viewers, blog categories and also allows users to submit blog content to the platform.
Evaluation
Background summary
An MVP design was implemented, user testing was carried out with a pilot testing group(some members of the Inspiring communities and WeavEast Network which represent our identified actors in the ecosystem).
Methodology
We ran three courses on Wayside to test the user experience for signing up as a user, course registration process, course participation and the discussion forum. We also populated the blog with content to observe the engagement rate.
We had some User Experience metrics for this process:
- Sign Up Process: I used the conversion rate results on the registration page and the number of users signing up.
- Course Participation Experience and Discussion Forum: With the evaluator’s help, we ran a user survey and used Google analytics results.
- Blog Post: We tested engagement rate with several blog views and google analytics results.
Outcomes & Lessons Learned
We launched the MVP and did some user testing. Results from our evaluation of the MVP led to the discovery of the following problems.
Introduction of separate pages for user registration and log in
Through the analytics result in the back end, I found that the conversion rate for the site visitors during sign in and user registration could not be accurately measured because the two forms were on the same page. Hence, the decision to create two separate pages for sign in and user registration in the next product release.
Demand for more intimate connection
The results of the survey for the test group revealed that users want more intimate connection on wayside. This led to the introduction of members profile page and a private chat feature. Users need information on other users on the platform before a conversation can be initiated. I designed the member profile page and added an ice breaker question function to enhance the user engagement for the private chat feature.
Introduction of Blog Categories
The content on our blog was not getting enough traction. We could tell because we have a visual counter function for the blog that tells us how many viewers have read the blog. Questions about blog experience was a part of the survey that was sent to the test group. We discovered that the users found it difficult to access the type of blog content they were interested in. This led to a design challenge on how to enhance the blog experience.
THe blog was redesigned to have categories and this design process also helped with the SEO of the platform as blog pillar content clustering was introduced. We've already started to see improvement in search rankings for various keywords across Wayside that we are tracking.
Introduction of Events
We introduced events because the survey for our test group revealed that users miss their course live events and other events as a result of too much information being discussed in the discussion groups, hence, the information about the event gets lost and there is nothing to automatically inform users about upcoming events.
This led to a design challenge and the outcome was to add an Events section to Wayside.
View High Fidelity PrototypeBack to
My portfolio