Patent Application

I had the pleasure of revamping the visual UI, iconography, pattern libraries, and front-end code for a patent administration software tool based out of Oakland, CA.


The Problem:

The existing application was functioning yet in dire need of a visual update. This pixelated screenshot shows the utilization of default WYSIWYG plugins with no thought given to the approachability of the experience.

The target users were patent staff who were technically savvy yet also desired a pleasant approach. We believed that our visual updates could increase usability and decrease fatigue.

Design Exploration

My first pass at a concept UI system focused on a blue color scheme. I also felt it was appropriate to add bold button labels, subtle secondary and tertiary colors, and a font family powered by Google Fonts.

Initial Feedback

After this first concept, I received feedback that the design scheme was too subtle for our broad userbase. Back to the drawing board.

Next Iteration: Friendly & Approachable

My next UI concept simplified the components even further, increasing the padding and contrast for better accessibility.

Additional UI

Application Mock-Up

Custom Icons

Final Thoughts

After design approval, I developed these components utilizing an existing CSS framework comprised of Bootstrap and SCSS. I then coordinated with the engineering team to implement the new UI elements into React templates. The initial feedback from the client was extremely positive.

If I were to do this project over today, I would do more research to understand how modern document applications have innovated new methods instead of staying within my current understanding of web-based software.