UX/IA Research

(1) Client

At the beginning of the project, the primary objective of the WRPBC organization was outlined. It aimed to address the growing wildfire crisis in British Columbia by developing and implementing wildfire prevention action plans and supporting affected communities. Additionally the website goal was set to align with the organizational mission. The client also wanted a cost-effective, SEO-friendly, and easily manageable website using WordPress CMS. Identifying client’s and website’s goals helped me clarify the project scope, making it clear what the client wanted to achieve with their website

(2) Executions of UX/IA research

a. Competitor Analysis

I analyzed two main competitors, “Direct Relief” and “United Way” to identify strengths and gaps in their UI elements and SEO Strategies. Thanks to their robust SEO strategies, I could easily access their sites via Google search and analyze website features and functionalities, and UI elements. Through this competitor analysis, I was impressed with their transparency, accountability, community focus involvement and volunteer engagement.

b. Archetypes & Groups

I developed eight user archetypes including wildfire victims, environment organizations, and government authorities to tailor the user experience and to tailor the user experience and ensure the website meets various user needs. Understanding the target audience helped get a concept to create user centric designs for key pages such as donation page and overall layout.

c. Persona & User Scenario

Based on the archetypes, I developed two personas, Ariana Jackson and Christoper Rodriguez, along with Ariana’s user scenario to understand their pain points, goals, and behaviors. By understanding Ariana’s frustration in getting information and resources from the website, I organized a sitemap according to their preferences to alleviate their frustrations.

d. Concept Map & Donation User Flow

A concept map was created to brainstorm the brief view of the WRPBC charity, organizing key topics and ideas. Thƒe donation user flow was designed to keep a smooth and user-friendly donation process. It was challenging to maintain consistency and usability while keeping the experience intuitive. To overcome this, I broke down the flow into manageable steps and continually tested and refined each stage considering the user's goal. Using the diagram.io tool helped in organizing the shapes and sequences.

e. Facets to Browse by & Sitemap

By establishing the five facets; Browse by Region, Duration, Cause, Impact, and Management, I aimed to enhance the website's search and filtering capabilities for WRPBC organization users. This approach would help users to adapt to available content and navigate large datasets without feeling overwhelmed. Additionally, a sitemap was created to outline the structure and hierarchy of the WRPBC website so that users could quickly locate specific information or pages they are interested in.

f. SEO Metadata

To help optimize WRPB organization’s website for search engines, titles, meta names and content within head tags focused on keywords like wildfire, wildfire relief and recovery support.

Design System

In this phase, I focused on creating a set of design style guidelines for the design elements such as the logo, typography, colors, buttons, and other UI components to provide the branding and visual appeal of the WRPBC organization. I opted for a color palette of green and shades of purple to symbolize nature, growth, creativity, and compassion, aligning with the WRPBC branding concept. Low-fidelity wireframes were created using Figma to visualize the design concepts. Although these wireframes were static design artifacts, they prevented misunderstandings and incorrect assumptions before the development of the actual website, making the process enjoyable and rewarding to me. The style guide also detailed the setup of the content management system (CMS), including configurations for the WordPress dashboard. This not only reinforced the WRPBC’s brand identity but also ensured consistent branding across all pages of the website.

Web Development with WordPress

Utilizing the organization theme from WordPress, I developed a customizable website with installation of necessary plugins to meet the needs of WRPBC clients. Installing a SEO optimization plugin for the WRPBC’s website would help improve its visibility in search engine result pages(SERPs). One challenge I faced was that I felt overwhelmed by building a website with WordPress due to the complexity of content management systems(CMS). To overcome this, I had to spend more time familiarizing myself with the features and functionality.

Result from Project

I really enjoyed working on the “WRPBC” project, which was my first project. It was a valuable experience where I learned how UX/IA research had a great impact on the design and web development process. It taught me that creating an effective website goes beyond just beautiful design and requires a user-centered approach informed by user goal-driven research and information architecture. It was a great lesson that the website should not only look good but also function well and meet the organization's goals. Furthermore, during the project, I gained hands-on experience with WordPress CMS and plugins, helping me to develop a customizable website tailored to the needs of clients. Overall, the “WRPBC project was a rewarding experience that prepared me for future projects in UX/UI design and web development.