[UX] Execution 1.10 | Developing High Fidelity Wireframes

Photo by Scott Graham

After settling on an initial design system, our team began transforming the rest of our low fidelity screens into high fidelity. Our goal with high-fidelity wireframes is to build a visually representative version of our first prototype that we can use to test with our users. This allows us to more accurately understand whether our users are willing to use our product, and take their feedback to further improve.

Running through our first round of building high fidelity wireframes was a great learning experience for our team because it was a new experience for many of us. In total, it took us ~3 part-time designers and eight weeks to complete. We spent two weeks for visual explorations, two weeks for our initial design system, three weeks for finishing our web+mobile wireframes, and one week for prototyping our wireframes for testing.

Hi-Fi Wireframes for Testing

Here are key learnings we had from the process.

Key Learnings

Through these learnings, we hope to improve our process and reduce time needed for future cycles.

Now that we have our high fidelity wireframes for our first prototype, we’re ready for user testing!

We are a budding startup in Silicon Valley aiming to simplify the act of giving. Our goal is to mobilize more people to get involved with meaningful causes.