Application Interface design

A sales archive streamlined for sharing
Champion Rep Portal (Savage Brands)

Responsive web/mobile application redesigned for usability and functional improvement

By Rodney Echols


Rep Portal is a web application that organizes sales content for unifying a nationwide sales process. It makes corporate approved case studies, videos, forms, white papers and documents easy to find and access. During technical discovery for a website redesign project, we uncovered the need for a complete rehaul of the current portal.


My role was to scope this project to fit the budget and direct the project team, which included an application engineer, an account strategist and a UI designer.


Savage Brands (Champion Fiberglass) 6/2016 –  9/2016

Case Study

Define requirements to scope the work of the solution.

The old tool needed to an efficient replacement that could fit the growth we would promote with the company website. I used notes from client/user interviews to categorize and list wins and pains. Based on the understanding of the problems I was able to discuss requirements and decide on a  vendor to partner with for app development and technical advising.


I directed a team debrief to map out a solution. The gist of my approach was based in conventional web practices and team collaboration. We had the objectives of ease usability and maintenance. The goals included fitting the new portal to the design of the new website, integration with the new platform, and improvement of interface design and information architecture.


Timing and the platform transition was a critical constraints to the project, and the details of the problems were gaining in technical detail. I presented pencil sketches of the UI and all elements to clearly communicate to the team. Since this project was initiated while the website redesign project was underway the flexibility of technical requirements (the new site would move to the WordPress platform) and launch timing (the portal launch would precede the launch of the new site) was not an option. In order to manage expectations I produced a scope and developed a 6-week schedule to pin down timing.


Discover :  I translated content inventory into specs to improve information architecture
The clients key pains were lack of control for managing content growth, we also knew that complex navigation was causing  poor user experience. Using the results from the content audit, I created a project plan for build of the interface and migration of content.


We would need to design a new front-end and backend interface to complete project objectives.

I created sketches and then designed wireframes to clarify the approach. For the front-end solution UI, I focused on structure and visual hierarchy using familiar interface parts. I then matched the visuals of the interface for the back-end. Next, I directed the developer through a solution to the content maintenance problems and we added sort and filter functionality make it very easy for the user. I wrote a specs document which I referenced to check content migration, make decisions on interface features and draw up maintenance processes.



SSL website,WordPress, mobile responsive application


WordPress, Illustrator, Microsoft Office, UI pattern design approach

Key Performance Metric:

The most challenging thing on this project was discovery, the previous tool was not effective but the client was very connected to it. This project had expectations set before the plan was even considered. We worked backwards on scoping by using the new design to lead the aesthetics on this tool

I found that using a very visual approach to requirements, team collaboration and specification documents was helpful and very fun, when sharing with all teams.


Other key accomplishments


Project budget – under $15K(20%) profit,
Customer feedback – described a successful balance of retaining the good parts / refreshing the tool,
Redesign look and usability of file repository; took fewer clicks to find anything and there was a system to govern maintenance
Identified key usability pain points to look out for,
Built key features and aesthetics for scalability,
Team member selection, first major project with a new vendor and set the tone our partnership, which resulted in the delivery of 5 to 6 other projects.

Team Members:

BLU27 (application engineer partner), Savage Brands Champion account team

Link/Samples: (private)


screenshots, sketches, wireframes, sample of content spec



Whoa! You really are impressed with my work. Thanks

Tell me how I can help you. We’ll talk soon.

Leave a message
Request samples