A place for belonging.

During my time at Vancouver Film School, my team and I created a promotional landing page for the donation system at CEED Centre Society.

 
 

THE CHALLENGE

CEED Centre Society, a charitable non-profit organization in Maple Ridge, Canada was in need of a new strategy to attract new members and donations. As a team, we created a campaign that promotes the cause and benefits of the CEED membership, ultimately increasing the audience's comprehension of what CEED does for their community. This campaign included a landing page and explainer motion pieces to showcase what CEED is and what they stand for as an organization.

 

ROLE

UX/UI Designer

Project Manager

TEAM

Jill Tao (UX/UI Designer)

Arturo Acevedo (Motion Designer)

Cecilia Cortes (Motion Designer)

PLATFORM

Desktop


DATE

7 Weeks

Toolkit

Design Process

Research > User Flow > Storyboard > Wireframes > Prototypes > Final Page

โ€˜How Might Weโ€™ Statements

We divided the statements into three categories that aligned with the overall goal of the project; To attract more engagement through donations. The dots on the sticky notes were our individual votes on what statements we wanted to focus on the most.

 

User Flow

We then created a flow chart on how a visitor would potentially find the landing page through social interaction, a desire for connection or to help the community.

 
 

Interactive Storyboard

While pitching our initial idea to the clients, we used an interactive storyboard for the presentation to better visualize the userโ€™s experience, using what we had created with our user flow diagram. My talented teammate Jill was the one responsible for the sketches seen in the storyboard slides.

 

Initial Wireframe exploration

Jill and I went our separate ways for the initial wireframe exploration. We decided to come up with a preliminary version each, and once completed, discuss what parts we could take from each design and move forward with.

 
 

Iterations

With the help of the feedback from an instructor, we began to review and examine each section, asking ourselves as we went through each round of iterations:

โ€œWas this benefitting our target audience?โ€

โ€œIs the user flow intuitive?โ€

โ€œdoes the information hierarchy make sense with the story telling?โ€

 

Final Solution

After some user testing, the final updates were made to the wireframes and then tested out in Invision. Confirming that each section looked accurate, we went on to build out the landing page. We were able to gain access to their platform they used for their main website, and build an offline webpage as a real-time mockup.

 

View the landing page here.