Curating Design

Web Design

Web Developement

Concept

A curated resource database to help designers find new and unexpected tools for growth.

View Website

Objective

Create an architecture resource database to help users find new and unexpected tools for growth.

Team

ArchiResouce was a personal project that I designed and developed myself.

Audience

Architecture students and professionals who are looking for new design resources.

My Role

Owner
User Research
Wireframes
Visual Design
Web Development
Implementation in Webflow

Tools

User Interviews in Google Docs
Affinity Mapping in Miro
Wireframing in Sketch and Figma
Prototyping in Figma
Visual Design in Figma
Implementation in Webflow

Takeaways

Successfully built a web app with hundreds of weekly users that was optimized based on user feedback.

Role

I was the sole designer and developer of this project. I Designed it in Figma and built it with Weblfow.

Problem

As a former architecture student, I remember struggling to find the right tutorial or application while pulling an all-nighter. I thought there has to be a way to alleviate this paintpoint.

Architecture students and professionals waste time and effort by scouring the internet for the one resource they need.

Solution

A hand-picked database of resources so you can focus on what really matters. I've created a database to discover the best tools, methodologies, plugins, and tutorials

Research Methods

User Interviews

Affinity Mapping

Prototype
Testing

User Interviews

Angie

A busy architecture student at NCSU School of Design studying who has a final presentation in a few weeks.

Busan

An architect at my past architecture firm with 4 years of professional experience.

Matt

A busy architecture student at NCSU School of Design studying who has a final presentation in a few weeks.

To brainstorm ideas for ArchiResource, I interviewed 3 target users (young architecture professionals) via Zoom for 15-30 minutes each. Each interview generated a series of "How Might We" notes.

How Might We...

Affinity Mapping

After forming a series of "how might we" questions, we organized our virtual sticky notes into categories.

Sketching

After synthesizing the data gained from the user interviews, I started sketching wireframes. I always start sketching ideas as fast as possible. The intention is to get ideas out as fast as possible. Sketching while collaborating in real-time is even more valuable.

Lofi Wireframing

Prototyping

A high-fidelity prototype was generated from the wireframes and I implemented some search functionality in Figma. After sharing the prototype with my coworkers, I received valuable information about ArchResources' pain points.

There will be hundreds of resources to filter through and it will get quite confusing if it isn't organized correctly. The resources would have to be split into categories that the users find intuitive. I polled several architects to find categories they would find helpful, and I developed a list of resource categories.

Implementation in Webflow

Lessons Learned

Know Where you are in the Design Process
Wireframe ideas before committing to high-fidelity mockups.
Usability First
No matter how aesthetically pleasing your work may be, it won’t strike a chord with the user unless it is easy to use.
Feedback Matters
User-testing is key to a quality product. Make sure to ask the right questions in order to meet the user's needs. What users think they are doing is often not what they actually do.

Takeaways

This was a great project for understanding in the UX process from user research to website implementation.

The website is continuing to gain popularity in the architecture community - helping students learn faster and achieve more.