About Us
Lorem ipsum dolor sit amet, consectetur adipi Suspendisse ultrices hendrerit nunc vitae vel a sodales. Ac lectus vel risus suscipit venenatis. Morbi dignissim mi non dui phaedrum ullamcorper.

Hirtenstraße 19, 10178 Berlin, Germany

+49 30 24041420

ouroffice@any.com

Follow Us

Archive

Thehartford.com

[vc_row content_width="grid" css=".vc_custom_1723658112893{padding-top: 0px !important;padding-bottom: 130px !important;background-color: #ffffff !important;}"][vc_column][edgtf_custom_font font_family="Raleway" font_size="55" line_height="120" font_weight="500" letter_spacing="0" text_align="left" content_custom_font="TheHartford.com" color="#303030"][edgtf_custom_font font_family="Raleway" font_size="19" line_height="32" font_weight="400" letter_spacing="0" text_align="left" content_custom_font="TheHartford.com is the public facing website for individual and commercial business. As a designer on the User Experience team, this was one of my core projects. I did extensive work that included usability testing, personas, wireframes, storyboards, content management, interactive elements, page layouts, conceptual redesigns, prototypes, photo editing, infographics, icons and animated videos. As a team member, I also contributed to defining and documenting the enterprise design system. These screens represent a sampling of the front-end public-facing UI design layouts and elements I worked on." color="#303030"][/vc_column][/vc_row][vc_row content_width="grid" content_aligment="center" css=".vc_custom_1723657893539{padding-top: 0px !important;padding-bottom: 0px !important;background-color: #ffffff !important;}"][vc_column][vc_single_image image="7520" img_size="full" alignment="center" css_animation="fadeIn" css=".vc_custom_1723657907229{border-bottom-width: 0px !important;padding-top: 0px !important;}"][/vc_column][/vc_row][vc_row content_width="grid" css=".vc_custom_1723657998843{padding-top: 0px !important;padding-bottom: 0px !important;background-color: #ffffff !important;}"][vc_column][vc_column_text] Background [/vc_column_text][/vc_column][/vc_row][vc_row content_width="grid" css=".vc_custom_1723657295170{padding-top: 25px !important;padding-bottom: 90px !important;background-color: #ffffff !important;}"][vc_column][edgtf_custom_font font_family="Raleway" font_size="19" line_height="32" font_weight="400" letter_spacing="0" text_align="left" content_custom_font="For each redesign of thehartford.com our team focused on enhancing the UX and did many conceptual design explorations. As a member of the User Experience team I partnered with product designers and business stakeholders to understand requirements, conduct research and perform usability testing or leveraged results provided from our Usability team. With requirements and goals in place, we would begin process flows and wireframes. Often, I started visual design and collaborated with content writers in parallel with wireframe sessions. Once we established a new element or site design, I created Invision prototypes for testing and stakeholder reviews. I worked closely with developers during implementation and oversaw designs transitioning to coded pages. I then worked with the developers and the QA team to catch any final discrepancies. Once implementation was complete, I updated the design system with any new design elements." color="#303030"][/vc_column][/vc_row][vc_row content_aligment="center" css=".vc_custom_1667498150414{padding-right: 20% !important;padding-bottom: 130px !important;padding-left: 20% !important;background-color: #ffffff !important;}"][vc_column][edgtf_process_holder number_of_items="five"][edgtf_process_item number="1" title="Research & Discovery" text="Business Requirements, Competitor Analysis, User Stories, User Interviews"][edgtf_process_item number="2" title="Ideation & Conceptualization" text="Personas, Journey Mapping, Process Flows, Exploratory Design"][edgtf_process_item number="3" title="Prototyping & Testing" text="Low/High Fidelity Wireframes, Prototypes, User Acceptance Testing, Visual design concepts, Page Layouts, Collaborate with content writer to align photography with content."][edgtf_process_item number="4"...

Animated Instructional Video

[vc_row content_width="grid" css=".vc_custom_1662311720025{padding-top: 0px !important;padding-bottom: 130px !important;}"][vc_column][edgtf_custom_font font_family="Raleway" font_size="55" line_height="120" font_weight="500" letter_spacing="0" text_align="left" content_custom_font="Animated Instructional Video" color="#303030"][edgtf_custom_font font_family="Raleway" font_size="19" line_height="32" font_weight="400" letter_spacing="0" text_align="left" content_custom_font="This is one of 4 animated videos I created for The Hartford to improve their customer experience when filing an auto claim. The primary goal of the video is to guide customers step-by-step through the claim process to ensure they know what to expect and have the best possible outcome. The secondary goal was to reduce call center volume from customers needing repeated assistance with their claims." color="#303030"][/vc_column][/vc_row][vc_row header_style="edgtf-light-header" content_aligment="center" css=".vc_custom_1679851515580{padding-top: 0px !important;padding-bottom: 0px !important;background-color: #f9f9f9 !important;}"][vc_column][vc_single_image image="7424" img_size="full" alignment="center" css_animation="fadeIn"][/vc_column][/vc_row][vc_row content_width="grid" css=".vc_custom_1723655009223{padding-top: 130px !important;padding-bottom: 0px !important;background-color: #ffffff !important;}"][vc_column][vc_column_text css=".vc_custom_1723655147654{border-top-width: 130px !important;}"] Background [/vc_column_text][/vc_column][/vc_row][vc_row content_width="grid" css=".vc_custom_1723657101050{padding-top: 25px !important;padding-bottom: 90px !important;background-color: #ffffff !important;}"][vc_column][edgtf_custom_font font_family="Raleway" font_size="19" line_height="32" font_weight="400" letter_spacing="0" text_align="left" content_custom_font="The claim process was divided into 4 videos - Claims Made Easy, Your Adjuster, Rental Vehicles and Repair Shops. During our brainstorming sessions, I sketched out storyboards and worked one on one with a copywriter to align animations with the script. For the audio, I engaged our video production team to record and produce the voice-over narration. Once storyboards were complete, I began building the graphics and animating each screen with After Effects." color="#303030"][/vc_column][/vc_row][vc_row content_aligment="center" css=".vc_custom_1673544487495{padding-right: 20% !important;padding-bottom: 130px !important;padding-left: 20% !important;background-color: #ffffff !important;}"][vc_column][edgtf_process_holder number_of_items="five"][edgtf_process_item number="1" title="Research" text="Competitor Research, Personas, Process Flow"][edgtf_process_item number="2" title="Storyboarding" text="Brainstorm visual ideas and blend in preliminary copy, establish key frames"][edgtf_process_item number="3" title="Visual Design & Content" text="Create visual assets and create rough keyframes, collaborate with content writer to marry up narrations to keyframes"][edgtf_process_item number="4" title="Audio & Animation" text="Script is recorded and animation development begins"][edgtf_process_item number="5" title="Encoding & Hosting" text="Encoding and final reviews, Host final videos on streaming platform, provide embed links"][/edgtf_process_holder][/vc_column][/vc_row][vc_row content_width="grid" css=".vc_custom_1723655504462{padding-top: 137px !important;padding-bottom: 0px !important;background-color: #ffffff !important;}"][vc_column][vc_column_text css=".vc_custom_1723655220725{border-top-width: 130px !important;}"] Storyboards [/vc_column_text][/vc_column][/vc_row][vc_row content_width="grid" css=".vc_custom_1723657109159{padding-top: 25px !important;padding-bottom: 90px !important;background-color: #ffffff !important;}"][vc_column][edgtf_custom_font font_family="Raleway" font_size="19" line_height="32" font_weight="400" letter_spacing="0" text_align="left" content_custom_font="Here are six refined storyboards. These come after the pencil sketches and are often used for reviews and testing. As the lead UX and visual designer, I worked with the claims team to rough out the script and brainstorm the animated...

Quoting App Redesign

[vc_row content_width="grid" content_aligment="center" css=".vc_custom_1722525410075{padding-top: 25px !important;padding-bottom: 90px !important;}"][vc_column][edgtf_custom_font font_family="Raleway" font_size="55" line_height="120" font_weight="500" letter_spacing="0" text_align="left" content_custom_font="Quoting App Redesign" color="#303030"][edgtf_custom_font font_family="Raleway" font_size="19" line_height="32" font_weight="400" letter_spacing="0" text_align="left" content_custom_font="Improving how new customers enter information and obtain an insurance quote on The Hartford's web-based quoting application — while also expanding the design system and enabling new capabilities for the development team." color="#303030"][/vc_column][/vc_row][vc_row content_aligment="center" css=".vc_custom_1686670021424{padding-bottom: 30px !important;background-color: #ffffff !important;}"][vc_column][vc_single_image image="7350" img_size="full" alignment="center"][/vc_column][/vc_row][vc_row content_width="grid" css=".vc_custom_1722529956647{padding-top: 0px !important;padding-bottom: 0px !important;}"][vc_column][vc_column_text css=".vc_custom_1722529937443{border-top-width: 130px !important;}"] Background [/vc_column_text][/vc_column][/vc_row][vc_row content_width="grid" content_aligment="center" css=".vc_custom_1658940821528{padding-top: 25px !important;padding-bottom: 90px !important;}"][vc_column][edgtf_custom_font font_family="Raleway" font_size="19" line_height="32" font_weight="400" letter_spacing="0" text_align="left" content_custom_font="The Hartford sells business, home and car insurance. To enhance the quoting process, a complete redesign was launched with the main goals being faster and easier, decrease drop-off rates, increase sales and refresh the design. A strong emphasis was placed on the mobile experience with responsive layouts. Some enhancements included pre-filling public data, progress indicator, simplified questions, customize and save quotes, online payments and issue policies without involving an agent. As lead designer, my job was to partner with the Personal Lines team and provide UX/UI designs and recommendations. From concepts through final designs, I worked closely with the product owners, other UI and UX designers, usability and development teams. Deliverables included wireframes, design concepts, prototype screens for all unique mobile, tablet and desktop devices, custom icons and illustrations, design system enhancements, redlining and style guides." color="#303030"][/vc_column][/vc_row][vc_row content_width="grid" content_aligment="center" css=".vc_custom_1659028590476{padding-bottom: 78px !important;}"][vc_column width="1/3"][edgtf_icon_with_text icon_pack="linear_icons" linear_icons="lnr-pushpin" icon_position="left" icon_type="normal" icon_size="edgtf-icon-tiny" icon_animation="" icon_flip="no" title="My Role" title_tag="h3" icon_color="#808080" icon_hover_color="#303030" text="As a member of the User Experience team, my role was to offer full UI/UX support to the Personal Lines team. I worked with Researchers, UX Designers, Stakeholders, Product Owners, Copywriters and Developers. I attended brainstorming sessions, created wireframes, and designed the UI from rough concepts through pixel-perfect prototypes." custom_icon_size="35"][vc_empty_space height="40px"][edgtf_icon_with_text icon_pack="linear_icons" linear_icons="lnr-warning" icon_position="left" icon_type="normal" icon_size="edgtf-icon-tiny" icon_animation="yes" icon_flip="no" title="Challenges" title_tag="h3" custom_icon_size="35" icon_color="#808080" icon_hover_color="#303030" text="Users are looking for a quick and accurate quote with little effort. They're easily gone if questions are too personal. However, the application needs a fair amount of data in order to generate an accurate quote. How do we retain the user through the entire...