Case Study: INKspire

inkspire.org
Current role: Special Projects Co-Director
Previously: Graphic designer, UX Lead, Creative Director
What I helped with:
Graphic Designs
Website wireframes and designs
Program management
Event coordination

Introducing INKspire

Project Overview
INKspire is a non-profit online publishing platform that targets youths between the ages 14 to 29 to write creative pieces that they want to express about different topics relevant to them and society.
‍
Want to know why the project got started, head on over to our kickstarter initiative: Read More
Problem Statement
We launched this online platform because we noticed that we always got published news and articles from the perspective of professional writers, while we do not hear enough youth voices, opinions and ideas on the same on-going topics.

Youths between the ages 14 to 29 and are interested in creative writing, needs access to a publishing platform that will help inspire their creativity to share stories, thoughts and ideas, while connecting with other youths, because it will encourage them to engage in the current global affairs, showcase their writing talents, and have an opportunity to explore the professional publishing process.
Overview Solutions
We designed INKspire’s look and feel similar to the web patterns of online news outlets. These design patterns will impact how our target audience interacts with the website especially how the content is laid out and presented.

To increase the awareness of youth voices, we created a platform specifically targeting youths between the ages 13 to 29 to express their thoughts in the form of writing. 

To give youths a safe creativity online platform to express their points of views on different topics related in our society today.
‍
To provide a platform to help youths with their writing skills where they will have one on one mentors and editors to help provide feedback on the work they created.

This will bring more awareness to youth voices all over the world This will bring more opportunity for youths to start publishing creative pieces similar to what the profession will be like.

My Role and Responsibilites

Design Tools:

Adobe Creative Cloud
InVision
Hot Jar
Slack
Asana
TypeForm
Trello

Throughout the years in the startup, I had multiple roles and was able to lead the design team to create multiple visual designs for the new website and new projects. For the version 1.0 of the website, I started off as the graphic designer for promotional content and gradually became the UX designer who helped out with the development team. I planned out many UX of key pages on the website, worked on graphic work, managed creative project content and assisted in event coordinations. Each team usually consists of 3-4 people in different roles that all work coherently to achieving the goals per project for the startup.

The Fun Parts

Starting with brand identity
Moodboard

The main website page was designed with a similar pattern as many popular online news media websites because users are likely to have already been familiar with a similar framework.

We specifically categorized headings and separated some sections into another navigation so that our target audience can easily sort out what they want to read on the website. Additionally, we focused on making more emphasis on the sign-up button as we want our target audience to consider bringing their creative talent on this platform. 

In the beginning of INKspire, we had a team of 3 people in the design team to determine the brand identity and UX logics for key webpages of the site. We were able to test the INKspire platform with the relationship with our young target users by seeing how many people used the website for reading or writing.

The brand identity of the website represents ideas (in the form of a lightbulb) and creative writing (in the form of the pencil inside) because we want our brand to speak for what our mission and vision is for the non-profit online platform.

Who's our target audience?

Target Audience
Target youths between the ages 13-29 (high school - post secondary - young professionals)
Personas
Highschool students, post-secondary students, yonge professionals

Our User's Journey

Users were categorized
New Users
Returning Users
Roles on the platform
Admin
Editors
Writers
Readers

Making it work with wireframes & prototypes

What we did
Following the design thinking processes, we started with brainstorming on paper, creating paper prototypes and then transferring to using Photoshop and other wire-frame tools to the structure of the website.

We would have weekly meetings on improvements of designs and see what change

I led the design strategy and worked on ux aspects for key pages on the website such as the main pages and internal database tool set, while our developer was able to implement and make the design visual come to life. 

We tested the website to a small amount of our target audience and collected feedback on what we can improve on. Our first test helped us find that users had a mindset of clicking on the top right corner the most when trying to read articles - similar to the close or leave pattern. So using this pattern, we added the sign up button to catch their attention when they display this mental model website habit.

Research, Testing and Analytics

Outcomes and Lessons
When the website was launched with BETA, we used HotJar, Google Analytics and surveys to see what our users thought about the accessibility, usability and design.

Hot Jar: we analyzed clicks and the warmest areas on the website where users are staying / clicking the most

We started off with hypotheses and I analyzed the results to indicate if our hypotheses were accurate. Every different situations we got from the testing, we made inferences on why we got that result and continued another round of testing.

For example, we assumed using visual hierarchy to promote the major topic with a heading for “Topics of the Months” at the top of the website, will catch users attention and click on those articles first. The test results came back with the same assumptions made where users are interested in the highlighted section and articles more than other articles. 

We did BETA testing with our internal users and collected data through user interviews and surveys.

We used Google Analytics to see the behaviours of our users to see which pages they are staying on longer in comparison to other pages, to put out more articles from this category by our writers.

Finally, the website version 1 launch

Outcomes and Lessons
When the website was launched with BETA, we used HotJar, Google Analytics and surveys to see what our users thought about the accessibility, usability and design.

Hot Jar: we analyzed clicks and the warmest areas on the website where users are staying / clicking the most

We started off with hypotheses and I analyzed the results to indicate if our hypotheses were accurate. Every different situations we got from the testing, we made inferences on why we got that result and continued another round of testing.

For example, we assumed using visual hierarchy to promote the major topic with a heading for “Topics of the Months” at the top of the website, will catch users attention and click on those articles first. The test results came back with the same assumptions made where users are interested in the highlighted section and articles more than other articles. 

We did BETA testing with our internal users and collected data through user interviews and surveys.

We used Google Analytics to see the behaviours of our users to see which pages they are staying on longer in comparison to other pages, to put out more articles from this category by our writers.

The fun does not stop, it's time to acquire and retain our members

Outcomes and Lessons
When the website was launched with BETA, we used HotJar, Google Analytics and surveys to see what our users thought about the accessibility, usability and design.

Hot Jar: we analyzed clicks and the warmest areas on the website where users are staying / clicking the most

We started off with hypotheses and I analyzed the results to indicate if our hypotheses were accurate. Every different situations we got from the testing, we made inferences on why we got that result and continued another round of testing.

For example, we assumed using visual hierarchy to promote the major topic with a heading for “Topics of the Months” at the top of the website, will catch users attention and click on those articles first. The test results came back with the same assumptions made where users are interested in the highlighted section and articles more than other articles. 

We did BETA testing with our internal users and collected data through user interviews and surveys.

We used Google Analytics to see the behaviours of our users to see which pages they are staying on longer in comparison to other pages, to put out more articles from this category by our writers.

The Outcomes, Challenges and Lessons

Outcomes
When the website was launched with BETA, we used HotJar, Google Analytics and surveys to see what our users thought about the accessibility, usability and design.

Hot Jar: we analyzed clicks and the warmest areas on the website where users are staying / clicking the most

We started off with hypotheses and I analyzed the results to indicate if our hypotheses were accurate. Every different situations we got from the testing, we made inferences on why we got that result and continued another round of testing.

For example, we assumed using visual hierarchy to promote the major topic with a heading for “Topics of the Months” at the top of the website, will catch users attention and click on those articles first. The test results came back with the same assumptions made where users are interested in the highlighted section and articles more than other articles. 

We did BETA testing with our internal users and collected data through user interviews and surveys.

We used Google Analytics to see the behaviours of our users to see which pages they are staying on longer in comparison to other pages, to put out more articles from this category by our writers.
Challenges
When the website was launched with BETA, we used HotJar, Google Analytics and surveys to see what our users thought about the accessibility, usability and design.

Hot Jar: we analyzed clicks and the warmest areas on the website where users are staying / clicking the most

We started off with hypotheses and I analyzed the results to indicate if our hypotheses were accurate. Every different situations we got from the testing, we made inferences on why we got that result and continued another round of testing.

For example, we assumed using visual hierarchy to promote the major topic with a heading for “Topics of the Months” at the top of the website, will catch users attention and click on those articles first. The test results came back with the same assumptions made where users are interested in the highlighted section and articles more than other articles. 

We did BETA testing with our internal users and collected data through user interviews and surveys.

We used Google Analytics to see the behaviours of our users to see which pages they are staying on longer in comparison to other pages, to put out more articles from this category by our writers.
Lessons
When the website was launched with BETA, we used HotJar, Google Analytics and surveys to see what our users thought about the accessibility, usability and design.

Hot Jar: we analyzed clicks and the warmest areas on the website where users are staying / clicking the most

We started off with hypotheses and I analyzed the results to indicate if our hypotheses were accurate. Every different situations we got from the testing, we made inferences on why we got that result and continued another round of testing.

For example, we assumed using visual hierarchy to promote the major topic with a heading for “Topics of the Months” at the top of the website, will catch users attention and click on those articles first. The test results came back with the same assumptions made where users are interested in the highlighted section and articles more than other articles. 

We did BETA testing with our internal users and collected data through user interviews and surveys.

We used Google Analytics to see the behaviours of our users to see which pages they are staying on longer in comparison to other pages, to put out more articles from this category by our writers.

The Next Steps

Ongoing Improvements
There is always room for improvements including website designs, ux experienceWebsite can have a dark theme for better accessibility for people who are colour blind
Making it more than just the platform
Expanding with more special projects for internal members to try out
Connecting with other nonprofits
Current goal for the start up is having AT LEAST ONE ARTICLE per month from each writer in the team

Project Credits

Ongoing Improvements
There is always room for improvements including website designs, ux experienceWebsite can have a dark theme for better accessibility for people who are colour blind
Making it more than just the platform
Expanding with more special projects for internal members to try out
Connecting with other nonprofits
Current goal for the start up is having AT LEAST ONE ARTICLE per month from each writer in the team
LINKEDINContact