CITIBANK RESPONSIVE SITE REDESIGN
In collaboration with Art Director I generated ideas for how to best adapt the browser layout for the mobile experience.
Techniques used for RD:
• We had a multi-column layout with a fluid grid for browser which allowed the content to scale and fit on smaller mobile screens & stacks the columns vertically
• I carefully cropped the background images without loosing their concept and made sure the overlapping elements (logo, heading, cta) would still fit, breathe, and be very legible.
• The "Calculate your rate" module had input fields. From usability standpoint I optimized and made them big enough to be tapped.
USER INTERFACE RESEARCH: MOBILE FORMS USABILITY
• I know filling out forms on smartphones is not easy for users. That's why I did usability research and reconfirmed: find a way to minimize the number of fields or use a slider ui (prices/budgets) to give people control over their actions.
Followed and evolved Citibank design language