PenFed, is a United States federal credit union headquartered in McLean, Virginia, chartered and regulated under the authority of the National Credit Union Administration (NCUA). PenFed is the nation's third largest federal credit union, with assets of $23 billion and more than 1.6 million members as of July 2017.
Sketch, Illustrator, Invision, HTML/CSS and Adobe Experience Manager.
During this website overhaul, which involve the migration to a new CMS. I had alot of different roles from creating visual infographics, user interface, to a web producer. One of my first tasks was to redesign content pages, using familar UI elements. There were a number components being used and ofcourse a style had to be maintained.
Affinity Partner Content Pages:
PenFed has relationships with numerous associations; United States Army Warrant Officers Association, United States Coast Guard Auxiliary (USCGAux), National War College Alumni Association, etc. I was tasked with reorganizing the content for these pages. I had to use certain components that showed a same pattern and theme throught designs.
Web Responsive Dropdown Icon Menu
Creating a new site navagation. We wanted to try visual elements to distingish each 2nd teir catagory items. For example, savings would indicate piggy bank symbol. I looked a competitor sites to see how iconography was treated. Chase used icons from a dropdown menu, while Wells Fargo used icons in there hero image sections. Both used flat outline icons. So proceed to create with a similar pattern.
FIXED vs ARM infographics
How to visually show the different between ARM vs FIXED. I first had to research the different between Adjustable-rate mortgages (ARM) and a Fixed-rate mortgages (FIXED). Then create a graph that showed the difference between the rates.
Visual Design Infographic
After validing on icons I created, I did my first round of prototyping, using sketch and invision. Then another teir of information was added on after the icons, making more complex...
We ended up using a megamenu for the dropdown menus just because it made more sense to have all the information show hovering over each section as oppse having have to hover over a section and an icon to uncover more information.