PROJECT OVERVIEW
Pre-Banc Website Redesign
For this freelance project, I created a website design for desktop and mobile using Figma. The site was for Pre-Banc Business Credit, Inc., a loan provider for small businesses based in Irvine, California. Their site had not been updated in decades, so I created a professional, refreshed design consistent with their existing branding.
Reviewing the Existing Site
The existing Pre-Banc site was extremely outdated and needed a complete transformation. After meeting with the client, I determined the site would benefit from a simpler 4 page structure, streamlined copy, and an updated look.
Previous Pre-Banc Homepage
Previous Pre-Banc About Page
Finding Inspiration
I searched for site design inspiration that reflected a simple and professional style. One of Pre-Banc's brand colors is bright red, so I looked for ways to incorporate bright colors without overwhelming the design. I liked the ideas of a subtle gradient background and clear sections to divide content.
 |  |  |
|---|
Reorganizing and Writing the Copy
A large part of this project was simplifying and re-organizing complex financial information in a way that made sense for small business owners. I condensed the copy into small chunks of text using simple language, with clear headings and bolded text for easy scanning.
Designing the Desktop Site
I then began designing the desktop version of the site. I selected font styles and created design elements to match the existing branding. I arranged the content into four pages: Home, About Us, Our Services, Contact, and a simple landing page for the Apply for Financing form.
 |  |  |  |
|---|---|---|---|
 |
Adapting for Mobile
After designing the desktop version, I simplified the site design to be optimized for mobile. This included adding a hamburger menu, adjusting font sizes, and using larger, touch-friendly buttons.
 |  |  |  |
|---|---|---|---|
 |
Creating a
Style Guide
I put together a quick style guide of the brand elements I used in the project, such as color codes and logos. I also included my font selections and sizes to aid and expedite the development process.
.png)
Dev Handoff
I received positive feedback on the site design and approval from the client. I then sent the site designs, style guide, and all assets to the development team, who built the site independently.
