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

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.

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:

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 Prototype
Back to
My portfolio