Oen Tech

year
Nov 2021-now
area
UI/UX, Frontend
visit
oen.tw
contributions
Interface Design
Experience Design
Motion Design
Frontend Engineering
features
Payment Dashboard
Product Checkout
Event Management
Updated

Oen Tech is a CRM-driven payment platform that brings engagement, fundraising, and membership together for nonprofits, businesses, and campaigns.

summary

First designer to enhance the platform's user experience, spanning from core functionalities to new feature development. My work focuses on creating intuitive, efficient, and visually cohesive experiences that empower our clients and end-users, while always balancing user needs with technical feasibility.

key contributions

Designed and implemented critical features including event check-in system, payment dashboard, streamlined checkout, new client onboarding and more. These contributions greatly improved the platform's functionality and user experience, playing a crucial role in Oen's growth and adoption among diverse organizations.

Image
Image
Image

The following are some of the projects that I have worked on:


Event attendee check-in #

One of my first major projects after joining the team focused on enhancing Oen's event management capabilities. While organizers could already create events and open registrations on the platform, we identified a critical need for an efficient attendee check-in system. This feature would allow organizers to track attendance, manage capacity, and ensure all registered participants were accounted for.

Four iPhone interfaces from event attendees check-in features that showcase confirm modal, check-in tickets selection, ticket QR code and check-in by typing ticket number directly

Collaborating closely with the team, we explored various approaches to streamline the check-in process. The solution we developed covered the entire workflow, from inviting team members via the admin panel and accepting check-in invitations, to the actual check-in process. Organizers could now check in guests by either scanning QR codes or searching the guest list. Additionally, we implemented basic attendance statistics, allowing event hosts to view attendance rates for different ticket types.

This update proved to be essential in ensuring a smooth and organized event experience. Following the initial release, we further enhanced the system by adding support for registration forms and promotion codes, making the event hosting functionality more versatile. Ultimately, these improvements resulted in a significantly better experience for both organizers and attendees, solidifying Oen's position as a comprehensive event management platform.

Team
1 Product Manager, 2 Engineers
Timespan
6 weeks
Visit
Megaport Festival ( megaportfest.oen.tw)
Kuma Academy ( kuma-acadrmy.oen.tw)
Kuma Academy 黑熊學院
Kuma Academy 黑熊學院
Megaport Festival 大港開唱
Megaport Festival 大港開唱
APSIS 雅太社創高峰會
APSIS 雅太社創高峰會

Payment statistics dashboard #

For businesses and organizations utilizing a payment platform, access to key payment metrics is crucial for making data-driven decisions. The payment statistics dashboard we developed aimed to provide this vital information within Oen, empowering organizations to refine their fundraising and engagement strategies.

To maximize the dashboard's value, we conducted extensive research and analysis to identify the most critical metrics for organizations. I focused on ensuring effective translation of data into visual representations, carefully selecting and implementing various chart types while understanding both the capabilities and limitations of our chosen charting library. These approaches resulted in a powerful tool that enables organizations to identify trends, pinpoint issues, and implement optimizations.

Responsive dashboard of donor demographics

The final dashboard features clear visualizations of essential metrics, including payment methods, average payment amounts, and payer demographics. Organizations can easily dive into transaction details and filter data based on criteria such as date ranges and payment methods. This comprehensive view of transaction data has significantly enhanced our clients' ability to understand their financial patterns and make informed decisions.

By providing these insights, we've empowered businesses to refine their approaches and improve their overall performance on Oen.

Team
1 Product Manager, 3 Engineers
Timespan
2.5 months
Dashboard of payment metrics on the left, general stats on the right

New checkout experience #

Previously, our platform required users to navigate across domains to complete purchases, allowing them to browse and shop merchandise from various organizations in a centralized location. However, our research revealed that users primarily entered organizations' sites with specific purchase intentions rather than for general browsing. This cross-domain journey not only increased the time and friction in the purchasing process but also resulted in lost audience insights and metrics for the organizations.

To address these issues, we reimagined the checkout process, focusing on creating a more intuitive and smooth interaction. We streamlined the experience by eliminating repetitive steps and providing relevant information at key points. I applied our pattern and component library to ensure consistency and coherence throughout the process. The result was a more streamlined and predictable purchasing journey for users.

Product details and recipient form with order details

This update significantly reduced the effort required to make purchases while allowing organizations to gain deeper insights into their audience. Simultaneously, it helped strengthen the organizations' brand presence and improved overall uniformity, laying a vital foundation for future growth and expansion.

Following the initial release, we implemented several additional features to enhance the platform's capabilities:

  • Promotion codes
  • Member-only products
  • Subscription options
  • Shipping fees
  • Bidding functionality

These new features empower organizations to engage with their audience more effectively, offering greater flexibility in their approach to sales and customer interaction.

Recipient form with order details page on FELIDAE
Product list page on 進咖啡商行
Product details page on 菱傳媒

The revamped checkout experience, combined with these new features, has not only improved user satisfaction but also provided organizations with more tools to tailor their offerings and build stronger relationships with their supporters.

Team
1 Product Manager, 1 Engineer
Timespan
4 weeks

Tailored client-specific websites #

In addition to our core platform, we've developed customized websites for our clients that leverage Oen's robust backend services and data infrastructure. They are designed to meet the unique needs and branding requirements of each organization while maintaining seamless integration with our platform.

By creating these tailored websites, we empower our clients to present a cohesive brand identity and offer personalized user journeys. From donation processing and event management to membership systems and data analytics, these custom sites harness the full potential of our platform. This approach not only enhances user engagement but also streamlines operations for our clients, allowing them to focus on their mission while we handle the technical issues.

Amount
20+
Type
Nonprofit organizations
Political parties
Events organizers
Business
Check
原聲教育協會
好事大平台
政治大學捐政網
雲開社會工作師
新北新創之星挑戰賽
臺中市助扶關懷協會
Several custom websites integrated with Oen services
台中市福助關懷協會
台中市福助關懷協會
原聲教育協會
原聲教育協會
雲開社會工作師
雲開社會工作師
自律聯盟好事大平台
自律聯盟好事大平台
國立政治大學捐政網
國立政治大學捐政網
新北新創之星挑戰賽
新北新創之星挑戰賽

New Homepage development #

In addition to creating client-specific websites, I collaborated with a contract designer to revamp our platform's homepage, infusing it with a modern aesthetic featuring vibrant illustrations and a soothing color palette. This update effectively reinforces the range of services our platform offers while showcasing our prominent clients.

My role extended beyond design into development, where I took charge of implementing animations and interactions in the features section. This hands-on approach ensured that the visual design was faithfully translated into a dynamic, engaging user experience. The new homepage not only elevates our brand presence but also provides a clear, visually appealing introduction to our platform's capabilities, serving as an effective entry point for potential clients and partners.

Mockup of new homepage
Mockup of new homepage
Mockup of new homepage