OmniStack Connect 2.0 Project
OmniStack | Omni HR Consulting's Official Learning Platform
Project Overview
I led the end-to-end redesign of the OmniStack Connect e-learning platform. The primary objective was to transform an outdated storefront into a high-converting, modern user experience that stakeholders felt confident marketing under the primary Omni brand.
Contributions
- UX Research & Analysis: Performed competitive audits and user-flow mapping to resolve navigational friction.
- Prototyping: Developed functional wireframes and high-fidelity prototypes in Figma to validate the user journey. view prototype
- User Testing: Facilitated testing sessions using Figma prototypes and Zoho Forms to gather actionable feedback on the new structure.
- Visual Assets: Created comprehensive mock-ups and design artifacts to guide the development phase. view mock-ups
- Dynamic Architecture: Rebuilt the site’s core structure using ACF (Advanced Custom Fields) and WooCommerce, moving from static pages to scalable, data-driven templates.
- Theme Building: Developed global styles and reusable components within Elementor Pro, ensuring site-wide design consistency.
- Functionality Integration: Configured advanced search capabilities using Ivory Search and Ajax Search Lite to improve product discoverability.
- Plugin Auditing: Researched and vetted the WordPress plugin ecosystem to ensure a lightweight and stable tech stack.
.png)
- Team Liaison: Coordinated with department heads to align site content with actual company offerings.
- Task Management: Guided team members in sourcing imagery and populating dynamic product data to meet project milestones.
- Project Scoping: Assisted in the initial planning and resource allocation to ensure a smooth transition from design to live site.
Project Deep-Dive
Problem Statement
Stakeholder lack of confidence in the original site had halted expansion plans. Key UX friction points included:
- Contextual Confusion: Major and modular courses were presented in isolation, leading to user frustration and accidental duplicate purchase requests.
- Operational Inefficiency: Inconsistent page updates and a lack of coherence between landing pages and product pages.
- Friction in Checkout: A disruptive user flow that required excessive clicks, hindering the decision-making process.
My Process
I focused on bridging the gap between visual storytelling and technical infrastructure:
- Research & Mapping: Conducted competitive audits and stakeholder interviews to map complex course relationships and identify industry-standard conversion patterns.
- Prototyping: Developed user-flow diagrams and wireframes, progressing to a lo-fi prototype to validate my hypothesis on course hierarchy with real users.
- Systems Design: Leveraged the CMS ecosystem to create a scalable foundation, ensuring future product additions remained consistent and effortless to manage.
Solutions
I transitioned the design into a robust WordPress/Elementor environment by rethinking the Information Architecture:
- Advanced Taxonomies: Introduced "Course Type" (to distinguish modular hierarchies) and "Course Catalog" (to group modular families), solving the "context" issue identified in research.
- Dynamic Templating: Utilized ACF (Advanced Custom Fields) and Elementor Theme Builder to move away from manual page duplication. This created a standardized system where design remains consistent while focusing purely on content optimization.
- E-commerce Integration: Fully integrated WooCommerce functionality to replace the previous fragmented back-end system, streamlining the purchase path.
Outcomes
The redesign restored stakeholder confidence and served as the launchpad for a major partnership campaign with Payflex.
- Conversion: The site secured the first direct purchases since the its inception in 2019.
- User Sentiment: Improved UX led to users adopting the site as a primary communication hub, signaling a successful shift in brand perception.
- Scalability: The analytics and structural wins from this project became the blueprint for optimizing other company-owned platforms.
Challenges & Outtakes
- Shifting Perspective: This project marked my evolution from an aesthetic-focused designer to an outcome-driven one, learning to prioritize user goals over visual trends.
- Project Management: Navigating a project of this scale solo taught me the importance of clear delivery timelines and the necessity of defining "Done" early in the process.
- Holistic UX: Post-launch technical debt between WordPress and Moodle highlighted a vital lesson: the user journey doesn't end at the "Checkout" button; it extends through the entire product delivery ecosystem.
- Build vs. Buy: I gained a new appreciation for resource management—specifically, evaluating when to develop custom solutions versus investing in paid tools to accelerate deployment.
More Projects
Omni Academy Website IA Structure & Theme Set-Up
A future-proof digital foundation for the Omni Academy, focused on a robust Information Architecture (IA) and a high-performance, responsive design system built for long-term scalability.
Figma
WordPress
WooCommerce
Elementor
Advanced Custom Fields
Strategic Website Migration & Brand Realignment
A multi-phased digital transition and brand reorganization, migrating legacy systems to a scalable architecture while mentored a junior team to ensure operational continuity and improved user data integrity.
Figma
WordPress
WooCommerce
Elementor
Advanced Custom Fields
Responsive Social Media Banner Assets & Design Framework for Omni HR Consulting
A strategic design system for cross-platform social media assets, utilizing responsive guidelines and custom Figma templates to ensure brand consistency and visual integrity across all devices.
Figma
WordPress
WooCommerce
Elementor
Advanced Custom Fields
ShimmerShan Website
The debut solo design and development of a bespoke web presence for a professional nail technician, transitioning the brand from social media-only to a dedicated, professional storefront.
