Logo with a book-shaped icon and the words 'auther' in gradient purple and blue colors.
Two laptop screens displaying a website called 'auther,' with the one on the left having a dark theme and the one on the right a light theme. The website shows an example of women-led articles related to user experience and research.

Project Overview

VenusHacks 2025 was not only my first hackathon, but my first in-person competition of any kind. With no backend or frontend development experience, I had a clear goal: meet new people and contribute however I could. Early on, a teammate pitched an idea that resonated with me and I wanted to help bring it to life: auther., a platform to spotlight research by women and help close the gender gaps in authorship and visibility.

With only one experienced developer on the team, I stepped naturally into UX design: owning the visual design, branding, secondary research, and guiding teammates through Figma. What began as a learning opportunity ended with our team winning Best Female Empowerment Hack, and for me, a crash course in rapid collaboration and design under pressure.

auther. makes women-led research more discoverable, amplifying voices that are often overlooked.


Role

Duration

Product Designer

36 hours

Tools & Skills

Figma, User research, Design systems, Visual design

The Crew

Ethan Vo, Kristen, Aaron Jin

160+

Participants

#1

Female Empowerment Hack

33

Projects

MacBook

Click to interact! Note: The website may take a while to load results.

CHALLENGE #1

Adapting to limited technical skills within the team.

With only one developer on the team and limited full-stack experience across our team members, we delegated tasks based on our strengths. As the sole designer, I led the design process by researching the problem space, developing the visual interface, and supporting a teammate in learning Figma so we could bring the concept to life together.

THE PROBLEM

We did some digging to better understand the problem space: the gender visibility gap in research.

2x

more men receive authorship or inventor credit compared to women (1)

43%

of women report being excluded from authorship on work they contributed to (1)

50%

of the papers led by women were cited less (2)

These websites were major point of inspiration, demonstrating how visibility platforms can uplift historically marginalized groups:

  1. citeblackauthors.com: a platform highlighting research produced by Black researchers, an often underrepresented minority in academia.

  2. disabledwriters.com: a database that connects journal editors to disabled writers to give the disabled community a voice.

Our Inspiration

Based on our secondary research and points of inspiration, we wanted to build something similar for women researchers: a place where their work is easy to find, recognize, and share.

CREATING THE DESIGN SYSTEM

Establishing a modern and approachable brand identity for light and dark modes.

To create an identity that felt modern and approachable, I explored colored gradients, typography, and multiple logo variations in rapid iterations. We wanted to create both light and dark modes to ensure that users could have an engaging and comfortable viewing experience depending on their preferences and accessibility needs.

Ultimately, our design decisions led us to choose:

  • Pink → yellow gradient (light mode) for energy and optimism

  • Blue → purple gradient (dark mode) for staying calm and focused.

  • Lowercase wordmark logo in Instrument Sans for easy readability and approachability

A chart displaying variations of the word 'AutHer' in different fonts, colors, and punctuation styles.
A chart displaying nine color swatches arranged in three rows and three columns, labeled 'Colors' at the top, with shades of pink, purple, blue, black, and gray.

Multiple variations of typography and color palettes

Exploring logo ideas for auther.: an open book

Once we decided on the general color scheme and typography, I began exploring logo ideas to reflect a book, tying into the platform's focus on research and knowledge. I ultimately created a logo with an open book, adding a glowing heart opening from the inside of the book to symbolize inspiration, appreciation, and recognition.

Before
Initial Explorations

Image showing six variations of a logo for the word "auther" with a colorful heart or box icon. The logos have different color schemes and design arrangements.

After
Final Brand

Comparison of two mode settings for the authenticator app: Light Mode with pink to orange gradient background, and Dark Mode with blue to purple gradient background.

DESIGNING THE PRODUCT

Designing under time constraints & balancing technical feasibility.

With less than 48 hours to complete our project and with one developer working on full stack development, our team needed to prioritize. With teammates and guidance from mentors, I created UI mockups for our proposed features: home, search, saved library, profile, and history pages.

However, due to technical feasibility, we decided to implement the core flows: home and search, leaving other extra flows to be implemented if there was extra time. Once the mockups for each feature were complete, I handed them off to our developer, providing guidance on the UI.

This constraint shaped many design decisions:

  • I simplified the search interface to reduce development complexity.

  • I used consistent card layouts

  • I communicated my designs with the developer and shared components to help speed up build time.

Home Page

Initial Mockups

Light Mode

Dark Mode

The image shows two versions of a website homepage side by side. The left side has a light pink gradient background with the logo 'auther.' in pink and orange, a search bar with placeholder text, and a sun icon at the top right. The right side has a dark background with the same logo in purple and blue, a similar search bar, and a moon icon at the top right.

Home Page

Final Implemented Design

Light Mode

Dark Mode

Screenshot showing two versions of a website called 'auther.' with the slogan 'Start your search with women-led research.' One version has a light background, pink and red accents, and a pink 'Search' button. The other version has a dark background, purple and blue accents, and a purple 'Search' button.

Search Page

Initial Mockups

Light Mode

Dark Mode

Comparison of website interface demonstrating light and dark themes with search bars, results, and pink and purple tags.

Search Page

Final Implemented Design

Light Mode

Dark Mode

Comparison of webpage in light and dark mode, displaying article titles, authors, publication dates, and labels indicating 'Verified Women-Led' in pink and purple.

EVALUATING THE PRODUCT

Presenting our product to judges: bringing auther. to life

To pitch auther. to the judges, I helped prepare a pitch and visual presentation for the judging round. To make our demo compelling during our presentation, we highlighted:

  • Our research & how the problem impacts women

  • Inequities our platform addresses and impact on empowering women in research

  • Our platform’s core visuals, features, and functionalities

  • Our mission and how auther. elevates women-led research

What I learned from my first hackathon experience!

  • Taught someone something new: by mentoring a teammate in Figma.

  • Adapting and contributing under uncertainty: I was able to adapt and contribute where I could add the most value despite limited coding experience.

  • Rapidly iterated on visual designs: developing branding and mockups, including logo, color palettes, and typography, compiling the Devpost, presenting and pitching our product to multiple judges.

  • Hands-on collaboration with a developer & balancing design ideas with technical feasibility: I practiced handing off designs, clarifying details, and offering flexible alternatives when time was tight.

  • Screen calibration affects perception: my designs looked perfectly balanced on my laptop but appeared much darker on other displays.

Captured Moments from VenusHacks 2025!