User Experience Developer at GE

Responsive Website Development for GE's Customer Experience Center of Excellence

The Customer Experience Center of Excellence (CX CoE) is an internal design agency for GE Capital. The team's previous website had only been designed for desktop viewing. This project set out to redesign and develop the website for an optimized tablet & mobile viewing experience.

Accomplishments

Facilitated design critique meetings
Hand-coded responsive website
Led interns through design activities to deliver additional projects

My Role

I collaborated across the entire design and development team to deliver the live website. This consisted of leading the design team meetings, developing the responsive interface using HTML / CSS / JavaScript, pushing the site to a live server, and performing site debugging to ensure cross-browser compatibility, including IE8.

Skills & Tools Mastered

Front-End Development: HTML, CSS (Object-Oriented CSS), JavaScript (jQuery.js, handlebars.js, JSON, API calls), Chrome DevTools, skeleton.css responsive boiler plate.
Interaction Design: Design team collaboration, brainstorm of design elements & interactivity, sketching, wireframes for responsive sites (desktop, tablet, mobile), Axure prototyping, Axure UI component library.

In-Depth: Responsive Website Development

Alongside the team's visual graphic designer, we met to discuss new interactive features that would more effectively present information for smaller screens.

These features included accordions, a collapsible menu, re-arranged divs, mobile modals, and element filtering. We then produced wireframes for the mobile design and layout, which the graphic designer incorporated into a final pixel-perfect Photoshop mock-up.

Using the pixel-perfect Photoshop mock-up, I marked up common elements in an effort to streamline the HTML structure. Following an Object-Oriented CSS (OOCSS) approach, I also captured common style elements into reusable CSS classes.

Using jQuery, CSS3 media queries, and the skeleton.css boilerplate enabled me to make each element adaptable by coding the structure using a custom responsive grid system.

Other Projects at GE

myAccounts Enterprise Web Application Development

Provided primary HTML / CSS / JS input for this enterprise-level application. Designed and Developed the Consumer Awareness page to meet style and business requirements. This included responsive web development and foreign language translation. The site is live at GE Capital myAccounts.

The new design reduced previous content from four webpages to one single page, employs CSS sprites to enhance page loading, and utf-8 character encoding for better language rendering. Assisted with the client-side technology migration from GWT to CSS / JS (backbone.js, require.js). Successfully converted 8 subviews into the new architecture and met quarter release deadline.

AMSTC Welcome Website Project Management

For our final self-managed internship project, I provided the project management for the development of a new welcome website to GE's Advanced Manufacturing and Software Technology Center (AMSTC). I lead brainstorming and design meetings to determine the layout, content and requirements.

As the project progressed, I provided high fidelity mock-ups that incorporated the team's ideas and this mock-up guided the web development. The site was completed as re-envisioned after several quick iterations and left with the AMSTC's internship manager.

Other Projects

Product Designer @ Omega Point

Designed several new features for a React-based online quant investing web app. Created wireframes and Axure interactive prototypes while working with developers to roll-out new functionality.

UX Engineer @ Idibon

Full redesign of text analytics platform. Led the front-end development, including customizing the Bootstrap component library, for this JS-heavy web app built atop the Rails API.

IA for Learning Analytics @ U Mich

Selected for Learning Analytics Fellowship. Acted as Lead Information Architect (IA) for team of designers developing a course exploration guide linked to career outcomes.

UX for Virtual Training @ Digital Green

Created wireframes & mock-ups of a MOOC and QA dashboard for an international development non-profit. Traveled to India for on-site user research.

Data & Design Coordinator @ DataDive

Created a Data Visualization Dashboard over a weekend-long data hackathon. Acted as coordinator for volunteer team of DataDive event planners.

Operations Manager @ MetWest HS

Oversee day-to-day operations, using design thinking to determine where to make process improvements. Redesigned a finals week calendar to easily generate updated schedules and reports each semester.

Home