The Developer Portal is intended to be the comprehensive, one stop shop for all YapStone documentation. It is distinct from but related to the API Platform, which is how partner applications interact with YapStone APIs.
User research, prototyping, UI design and art direction
Increased unique visitors by 30% and exceeded expectation by raised approximately 8% revenues every month.
To turn the Yapstone API into an asset that generates new prospects organically, helps close deals with potential customers, and supports a high level of customer satisfaction among existing customers.
Everything we build should be done with an eye toward making the developer experience as enjoyable and quick as possible. External developers have a lot of work to do, only some of which relates to YapStone. They want to get done quickly so they can move on to the next thing.
External developers do not want to become experts in payments, onboarding, underwriting, etc. They likely won't care about jargon or details beyond how to integrate so they can get money flowing through their systems. We shouldn't even assume developers know that most of the payments rails are batched, nor should we attempt to educate them. We have payment APIs and instructions on how to use them and documentation on when funds will be available. Everything else is needless detail.
I created a high-level list of site features to further define and guide the vision for the product. Prioritizing the features with supporting research created a clear order of execution.
Next, I conducted an open card sort to get a sense of how users think of groups, concepts and categories. Because we are exploring several categorization concepts we want to learn what is most natural to people.
Once we understood the users need and developed the Use Cases, we went to work on the information architecture. Developing a high level site map and specific user flows, we then guided the client through the complete experience, strategize on site content and discussed next steps.
After gaining buy in from the client and the internal team we went to work flushing out a set of responsive wireframes that would define all the features on each page. With the Persons, Use Cases, Goals and Flow Diagrams in hand we had a solid foundation to design a UX that the client’s audience would grow to love. In total the team put together over 50 annotate wireframes. Each design highlighting the features and functionality on each page and how a user would flow through the site gaining valuable information and making an informed purchase decision.
With a solid set of wireframes, the company’s style guide and an approved style scape direction the high fidelity phase of the process still took a ton of time. The team and I slaved over the details and worked late a few nights to present two completely different directions for the visual UI. The approved direction spoke to the clean airy feel of the brand which was simple yet complex at the same time. It design wasn’t loud or in your face it was easy on the eye and told a story as a user scrolled down the page.
The final step in the design process was to hand everything off to the development team. We put together a quick design system the defined all of the grids, colors, fonts, buttons, icons, and UI elements used throughout the site design. This helped the development team to quickly move through their process and launch the site.
