![\"Homeserve](\"https:\/\/www.dxtr.co.uk\/wp-content\/uploads\/2023\/08\/homeserve_logo_horizontal_lockup-1-300x51.png\"){kind=logo}
<\/p>\n[et_pb_section fb_built=”1″ admin_label=”Services Header” _builder_version=”4.22.2″ background_color=”#bc0101″ vertical_offset=”0px” height=”800px” custom_margin=”0px||||false|false” custom_padding=”0|0px|0px|0px|false|false” hover_transition_duration=”0ms” locked=”off” global_colors_info=”{}”][et_pb_row column_structure=”1_2,1_2″ use_custom_gutter=”on” gutter_width=”1″ make_equal=”on” custom_padding_last_edited=”on|phone” module_class=” et_pb_row_fullwidth” _builder_version=”4.22.2″ background_color=”rgba(0,0,0,0)” background_size=”initial” background_position=”top_left” background_repeat=”repeat” vertical_offset=”50px” width=”100%” width_tablet=”100%” width_phone=”80%” width_last_edited=”on|desktop” max_width=”100%” max_width_tablet=”100%” max_width_phone=”” max_width_last_edited=”on|desktop” module_alignment=”center” custom_margin=”0px|auto|0px|auto|false|false” custom_margin_tablet=”” custom_margin_phone=”-40px|auto|-2px|auto|false|false” custom_margin_last_edited=”on|phone” custom_padding=”0px|20px|0px|0px|false|false” custom_padding_tablet=”” custom_padding_phone=”0px|0px|0px|0px|false|false” background_last_edited=”on|tablet” make_fullwidth=”on” locked=”off” global_colors_info=”{}”][et_pb_column type=”1_2″ _builder_version=”4.22.2″ background_color=”rgba(0,0,0,0)” background_position=”top_left” custom_padding=”4%|6%|8%|16%|false|false” custom_padding_tablet=”0%|||8%|false|false” custom_padding_phone=”20px|0%|90px|0%|false|false” custom_padding_last_edited=”on|desktop” global_colors_info=”{}” custom_padding__hover=”|||”][et_pb_divider color=”#ffffff” divider_weight=”3px” _builder_version=”4.21.0″ max_width=”100px” module_alignment=”left” custom_margin=”||20px||false|false” custom_padding=”0px||20px||false|false” animation_style=”none” saved_tabs=”all” locked=”off” global_colors_info=”{}”][\/et_pb_divider][et_pb_cta title=”Revitalising Web Presence With a New Design System” button_url=”https:\/\/www.dxtr.co.uk\/index.php\/case-study-2-e-commerce-website\/” admin_label=”Feature 01″ _builder_version=”4.22.2″ header_font=”Montserrat|900|||||||” header_text_color=”#ffffff” header_font_size=”42px” header_letter_spacing=”-1px” body_font=”Montserrat||||||||” body_text_color=”#ffffff” body_font_size=”16″ body_line_height=”1.4em” use_background_color=”off” custom_button=”on” button_text_color=”#bc0101″ button_bg_color=”#ffffff” button_border_color=”#ffffff” button_border_radius=”0″ button_letter_spacing=”2″ button_font=”Montserrat|||on|” button_use_icon=”off” button_custom_margin=”||||false|false” button_custom_margin_tablet=”” button_custom_margin_phone=”-60px||40px||false|false” button_custom_margin_last_edited=”on|phone” text_orientation=”left” background_layout=”light” module_alignment=”center” custom_margin=”|||” custom_margin_tablet=”” custom_margin_phone=”” custom_margin_last_edited=”on|phone” custom_padding=”|||” custom_padding_tablet=”” custom_padding_phone=”|0px||0px||” custom_padding_last_edited=”on|phone” animation_direction=”bottom” button_text_color_hover=”#6eba01″ button_border_color_hover=”#6eba01″ button_border_radius_hover=”0″ button_letter_spacing_hover=”2″ button_bg_color_hover=”rgba(0,0,0,0)” saved_tabs=”all” locked=”off” global_colors_info=”{}” button_text_size__hover_enabled=”off” button_one_text_size__hover_enabled=”off” button_two_text_size__hover_enabled=”off” button_text_color__hover_enabled=”on|hover” button_text_color__hover=”#ffffff” button_one_text_color__hover_enabled=”off” button_two_text_color__hover_enabled=”off” button_border_width__hover_enabled=”off” button_one_border_width__hover_enabled=”off” button_two_border_width__hover_enabled=”off” button_border_color__hover_enabled=”on” button_border_color__hover=”#6eba01″ button_one_border_color__hover_enabled=”off” button_two_border_color__hover_enabled=”off” button_border_radius__hover_enabled=”on” button_border_radius__hover=”0″ button_one_border_radius__hover_enabled=”off” button_two_border_radius__hover_enabled=”off” button_letter_spacing__hover_enabled=”on” button_letter_spacing__hover=”2″ button_one_letter_spacing__hover_enabled=”off” button_two_letter_spacing__hover_enabled=”off” button_bg_color__hover_enabled=”on” button_bg_color__hover=”rgba(0,0,0,0)” button_one_bg_color__hover_enabled=”off” button_two_bg_color__hover_enabled=”off”]<\/p>\n
<\/p>\n
Visual refresh following a company-wide rebranding exercise, coinciding with a move to a component-based rebuild.<\/p>\n
<\/p>\n
<\/p>\n
[\/et_pb_cta][\/et_pb_column][et_pb_column type=”1_2″ _builder_version=”4.22.2″ background_color=”rgba(0,0,0,0)” use_background_color_gradient=”on” background_color_gradient_direction=”27deg” background_color_gradient_stops=”rgba(0,0,0,0) 0%|rgba(0,0,0,0) 86%” background_color_gradient_start=”rgba(0,0,0,0)” background_color_gradient_end=”rgba(0,0,0,0)” background_color_gradient_end_position=”86%” background_enable_image=”off” background_position=”center_left” custom_padding=”0px|40px|0px|0px|false|false” custom_padding_tablet=”” custom_padding_phone=”0px|80px|30px|0px|false|false” custom_padding_last_edited=”on|phone” background_last_edited=”on|tablet” background_color_gradient_stops_tablet=”rgba(0,0,0,0) 0%|rgba(0,0,0,0) 86%” background_color_gradient_stops_phone=”rgba(0,0,0,0) 0%|rgba(0,0,0,0) 86%” background_color_gradient_start_tablet=”rgba(0,0,0,0)” background_color_gradient_start_phone=”rgba(0,0,0,0)” parallax_tablet=”off” background_size_tablet=”cover” global_colors_info=”{}” custom_padding__hover=”|||” background_color_gradient_start_tablet_preview_tablet=”#bc0101″][et_pb_image src=”https:\/\/www.dxtr.co.uk\/wp-content\/uploads\/2020\/05\/ecommerce-website-refresh-003.png” show_bottom_space=”off” _builder_version=”4.22.2″ positioning=”relative” position_origin_r=”top_right” vertical_offset=”10px” horizontal_offset=”25px” position_origin_a_tablet=”” position_origin_a_phone=”” position_origin_a_last_edited=”on|desktop” position_origin_f_tablet=”” position_origin_f_phone=”” position_origin_f_last_edited=”on|desktop” position_origin_r_tablet=”” position_origin_r_phone=”” position_origin_r_last_edited=”on|desktop” width=”150%” width_tablet=”120%” width_phone=”200%” width_last_edited=”on|tablet” module_alignment=”center” custom_margin=”-100px|0px||-41px|false|false” custom_margin_tablet=”-80px|0px||0px|false|false” custom_margin_phone=”-80px|0px||0px|false|false” custom_margin_last_edited=”on|phone” custom_padding=”|0px||0px|false|false” background_last_edited=”on|tablet” positioning_tablet=”” positioning_phone=”” positioning_last_edited=”on|desktop” global_colors_info=”{}”][\/et_pb_image][\/et_pb_column][\/et_pb_row][\/et_pb_section][et_pb_section fb_built=”1″ _builder_version=”4.16″ background_color=”#333333″ locked=”off” global_colors_info=”{}”][et_pb_row column_structure=”1_4,3_4″ _builder_version=”4.21.0″ background_color=”rgba(0,0,0,0)” width=”70%” width_tablet=”90%” width_phone=”90%” width_last_edited=”on|tablet” custom_margin=”0px||0px||false|false” custom_padding=”40px|20px|40px|20px|false|false” locked=”off” global_colors_info=”{}”][et_pb_column type=”1_4″ _builder_version=”4.16″ background_enable_color=”off” custom_padding=”|||” global_colors_info=”{}” custom_padding__hover=”|||”][et_pb_text _builder_version=”4.22.2″ text_font=”Montserrat||||||||” text_text_color=”#ffffff” header_text_color=”#ffffff” header_3_text_color=”#ffffff” header_4_font=”Montserrat||||||||” header_4_text_color=”#ffffff” background_color=”rgba(0,0,0,0)” custom_padding=”||0px|0px|false|false” locked=”off” global_colors_info=”{}”]<\/p>\n
UI Design\u00a0 \/\u00a0\u00a0<\/span>UX Design<\/span><\/p>\n [\/et_pb_text][\/et_pb_column][et_pb_column type=”3_4″ _builder_version=”4.16″ background_enable_color=”off” custom_padding=”|||” global_colors_info=”{}” custom_padding__hover=”|||”][et_pb_text _builder_version=”4.16″ text_font=”Montserrat||||||||” text_text_color=”#ffffff” header_text_color=”#ffffff” header_3_text_color=”#ffffff” header_4_font=”Montserrat||||||||” header_4_text_color=”#ffffff” background_color=”rgba(0,0,0,0)” custom_padding=”||0px|0px|false|false” locked=”off” global_colors_info=”{}”]<\/p>\n Co-located:<\/strong> Scrum Master \/\u00a0\u00a0<\/span>Front End Developer [\/et_pb_text][\/et_pb_column][\/et_pb_row][\/et_pb_section][et_pb_section fb_built=”1″ admin_label=”Services Header” _builder_version=”4.16″ locked=”off” global_colors_info=”{}”][et_pb_row _builder_version=”4.22.2″ width=”60%” width_tablet=”80%” width_phone=”80%” width_last_edited=”on|tablet” custom_padding=”80px|20px|80px|20px|false|false” global_colors_info=”{}”][et_pb_column type=”4_4″ _builder_version=”4.16″ custom_padding=”|||” global_colors_info=”{}” custom_padding__hover=”|||”][et_pb_text _builder_version=”4.22.2″ text_font=”|600|||||||” text_font_size=”24px” text_line_height=”1.4em” locked=”off” global_colors_info=”{}”]<\/p>\n HomeServe are a multinational providing insurance cover for a range of home utility emergencies.<\/p>\n Joining the UK based tech hub following a rebrand, I was asked to develop the print style guide into a design system and pattern library for the US website, who wanted something that was distinct from the UK site but felt like part of the same family.<\/p>\n [\/et_pb_text][et_pb_text _builder_version=”4.22.2″ text_font=”|300|on||||||” text_font_size=”24px” text_line_height=”1.4em” locked=”off” global_colors_info=”{}”]<\/p>\n By the way, we just fired our development partner for crazy delays, so your stakeholders hate the UK tech hub already!\u00a0<\/p>\n<\/blockquote>\n [\/et_pb_text][\/et_pb_column][\/et_pb_row][\/et_pb_section][et_pb_section fb_built=”1″ _builder_version=”4.22.2″ background_color=”#ffffff” custom_padding=”40px|0px|0px|0px|false|false” locked=”off” global_colors_info=”{}”][et_pb_row column_structure=”1_3,1_3,1_3″ _builder_version=”4.22.2″ width=”85%” custom_padding=”0px|0px|40px|0px|false|false” global_colors_info=”{}”][et_pb_column type=”1_3″ _builder_version=”4.22.2″ background_enable_color=”off” custom_padding=”0px|0px|0px|0px|false|false” global_colors_info=”{}” custom_padding__hover=”|||”][et_pb_text _builder_version=”4.22.2″ text_font=”|600|||||||” text_text_color=”#000000″ text_font_size=”24px” text_line_height=”1.4em” custom_margin=”||12px||false|false” locked=”off” global_colors_info=”{}”]<\/p>\n Problem<\/p>\n [\/et_pb_text][et_pb_text _builder_version=”4.22.2″ text_font=”||||||||” text_text_color=”#666666″ text_line_height=”1.4em” locked=”off” global_colors_info=”{}”]<\/p>\n An agency had delivered a rebrand but this didn’t include anything for the digital estate. Joining the UK based tech hub, I was asked to redesign the website for the USA business who wanted something that was distinct from the UK site but felt like part of the same family.\u00a0<\/p>\n [\/et_pb_text][et_pb_text _builder_version=”4.22.2″ _module_preset=”default” text_font=”|300|||||||” text_font_size=”24px” text_line_height=”1.4em” locked=”off” global_colors_info=”{}”]<\/p>\n “<\/em>By the way, we just fired our development partner for crazy delays, so your stakeholders hate the UK tech hub already!”<\/em><\/p>\n<\/blockquote>\n [\/et_pb_text][\/et_pb_column][et_pb_column type=”1_3″ _builder_version=”4.16″ background_enable_color=”off” custom_padding=”0px|0px|0px|0px|false|false” global_colors_info=”{}” custom_padding__hover=”|||”][et_pb_text _builder_version=”4.22.2″ text_font=”|600|||||||” text_text_color=”#000000″ text_font_size=”24px” text_line_height=”1.4em” custom_margin=”||12px||false|false” locked=”off” global_colors_info=”{}”]<\/p>\n Solution<\/p>\n [\/et_pb_text][et_pb_text _builder_version=”4.22.2″ text_font=”||||||||” text_text_color=”#666666″ text_line_height=”1.4em” hover_enabled=”0″ locked=”off” global_colors_info=”{}” sticky_enabled=”0″]<\/p>\n A complete redesign of the USA website with a design system and component-based pattern library following atomic design principles.\u00a0<\/p>\n Product listing pages with redesigned product cards, product detail pages, basket journey and customer account area including slots for product cross\/up sells.\u00a0<\/p>\n<\/p>\n [\/et_pb_text][\/et_pb_column][et_pb_column type=”1_3″ _builder_version=”4.16″ background_enable_color=”off” custom_padding=”0px|0px|0px|0px|false|false” global_colors_info=”{}” custom_padding__hover=”|||”][et_pb_text _builder_version=”4.22.2″ text_font=”|600|||||||” text_text_color=”#000000″ text_font_size=”24px” text_line_height=”1.4em” custom_margin=”||12px||false|false” locked=”off” global_colors_info=”{}”]<\/p>\n Business Impact<\/p>\n [\/et_pb_text][et_pb_text _builder_version=”4.22.2″ text_font=”||||||||” text_text_color=”#666666″ text_line_height=”1.4em” hover_enabled=”0″ locked=”off” global_colors_info=”{}” sticky_enabled=”0″]<\/p>\n Visual consistency throughout the site was greatly improved, presenting a more professional image and building trust with customers.\u00a0<\/p>\n A component-based build delivers efficiency and scalability with re-usable page modules, reducing development overhead and time-to-market.<\/p>\n The development team were able to swiftly rebrand components to deliver a customer account area for a newly acquired sub-brand, mirroring the parent site and simplifying support requirements.<\/p>\n [\/et_pb_text][\/et_pb_column][\/et_pb_row][\/et_pb_section][et_pb_section fb_built=”1″ _builder_version=”4.16″ background_color=”rgba(0,0,0,0.04)” custom_margin=”0px|||||” custom_padding=”1px||0px|||” global_colors_info=”{}”][et_pb_row _builder_version=”4.22.2″ background_size=”initial” background_position=”top_left” background_repeat=”repeat” custom_margin=”0px|auto||auto|false|false” custom_padding=”||0px|||” custom_width_px=”710px” locked=”off” global_colors_info=”{}”][et_pb_column type=”4_4″ _builder_version=”4.16″ background_position=”top_left” custom_padding=”|||” global_colors_info=”{}” custom_padding__hover=”|||”][et_pb_text admin_label=”Testimonials Section Title” _builder_version=”4.16″ header_font=”Montserrat||||” header_text_align=”center” header_font_size=”36px” background_size=”initial” background_position=”top_left” background_repeat=”repeat” text_orientation=”center” background_layout=”dark” max_width=”710px” module_alignment=”center” custom_margin=”0px||||false|false” custom_padding=”13px|||||” animation_style=”fold” animation_direction=”bottom” animation_intensity_fold=”20%” global_colors_info=”{}”]<\/p>\n [\/et_pb_text][et_pb_divider color=”#000000″ divider_weight=”3px” _builder_version=”4.16″ max_width=”100px” custom_padding=”||20px|” locked=”off” global_colors_info=”{}”][\/et_pb_divider][\/et_pb_column][\/et_pb_row][et_pb_row column_structure=”1_3,1_3,1_3″ _builder_version=”4.22.2″ width=”90%” border_color_all=”rgba(0,0,0,0.2)” global_colors_info=”{}”][et_pb_column type=”1_3″ _builder_version=”4.16″ global_colors_info=”{}”][et_pb_image src=”https:\/\/www.dxtr.co.uk\/wp-content\/uploads\/2023\/11\/ben.png” alt=”Ben” title_text=”ben” _builder_version=”4.22.2″ max_width_tablet=”30%” max_width_phone=”40%” max_width_last_edited=”on|tablet” module_alignment=”left” height=”135px” custom_margin=”||-2px|||” module_alignment_tablet=”left” module_alignment_phone=”left” module_alignment_last_edited=”on|desktop” global_colors_info=”{}”][\/et_pb_image][et_pb_text _builder_version=”4.22.2″ header_3_font=”Montserrat||||||||” custom_margin=”10px||0px||false|false” custom_padding=”||||false|false” global_colors_info=”{}”]<\/p>\n [\/et_pb_text][et_pb_text _builder_version=”4.22.2″ text_font=”||||||||” custom_margin=”|0px||0px|false|false” global_colors_info=”{}”]<\/p>\n YOUNG PROFESSIONAL [\/et_pb_text][et_pb_text _builder_version=”4.22.2″ header_3_font=”Montserrat||||||||” header_4_font=”Montserrat||||||||” custom_margin=”-10px||1px||false|false” global_colors_info=”{}”]<\/p>\n [\/et_pb_text][et_pb_text _builder_version=”4.22.2″ text_font=”||||||||” custom_margin=”0px|0px||0px|false|false” custom_padding=”||0px||false|false” border_color_all=”rgba(0,0,0,0)” border_style_all=”none” global_colors_info=”{}”]<\/p>\n “I’m busy and work long hours, I don’t have time to source contractors or do the work myself”<\/i><\/span><\/p>\n<\/blockquote>\n [\/et_pb_text][\/et_pb_column][et_pb_column type=”1_3″ _builder_version=”4.22.2″ custom_padding=”||32px||false|false” border_color_bottom=”rgba(0,0,0,0.3)” global_colors_info=”{}”][et_pb_image src=”https:\/\/www.dxtr.co.uk\/wp-content\/uploads\/2023\/11\/Isaac-and-erin.png” alt=”Isaac and Erin” title_text=”Isaac and erin” _builder_version=”4.22.2″ max_width_tablet=”50%” max_width_phone=”100%” max_width_last_edited=”on|tablet” module_alignment=”left” height=”135px” custom_margin=”||-1px|||” module_alignment_tablet=”left” module_alignment_phone=”left” module_alignment_last_edited=”on|tablet” global_colors_info=”{}”][\/et_pb_image][et_pb_text _builder_version=”4.16″ header_3_font=”Montserrat||||||||” custom_margin=”10px||0px||false|false” custom_padding=”||||false|false” global_colors_info=”{}”]<\/p>\n [\/et_pb_text][et_pb_text _builder_version=”4.16″ text_font=”||||||||” custom_margin=”|0px||0px|false|false” global_colors_info=”{}”]<\/p>\n RETIRED COUPLE [\/et_pb_text][et_pb_text _builder_version=”4.16″ header_3_font=”Montserrat||||||||” header_4_font=”Montserrat||||||||” custom_margin=”-10px||1px||false|false” global_colors_info=”{}”]<\/p>\n [\/et_pb_text][et_pb_text _builder_version=”4.16″ text_font=”||||||||” custom_margin=”|0px||0px|false|false” border_color_all=”rgba(0,0,0,0)” border_style_all=”none” global_colors_info=”{}”]<\/p>\n “Losing heating in Winter is a health risk for us – we need faults fixing fast”<\/i><\/span><\/p>\n<\/blockquote>\n <\/span><\/p>\n [\/et_pb_text][\/et_pb_column][et_pb_column type=”1_3″ _builder_version=”4.22.2″ _module_preset=”default” global_colors_info=”{}”][et_pb_image src=”https:\/\/www.dxtr.co.uk\/wp-content\/uploads\/2023\/11\/Paul-and-Maya.png” alt=”Paul and Maya” title_text=”Paul and Maya” _builder_version=”4.22.2″ max_width=”100%” max_width_tablet=”50%” max_width_phone=”100%” max_width_last_edited=”on|tablet” module_alignment=”right” height=”130px” custom_margin=”||0px|||” module_alignment_tablet=”left” module_alignment_phone=”left” module_alignment_last_edited=”on|tablet” global_colors_info=”{}”][\/et_pb_image][et_pb_text _builder_version=”4.16″ header_3_font=”Montserrat||||||||” custom_margin=”10px||0px||false|false” custom_padding=”||||false|false” global_colors_info=”{}”]<\/p>\n [\/et_pb_text][et_pb_text _builder_version=”4.16″ text_font=”||||||||” custom_margin=”|0px||0px|false|false” global_colors_info=”{}”]<\/p>\n YOUNG COUPLE IN FIRST HOME [\/et_pb_text][et_pb_text _builder_version=”4.16″ header_3_font=”Montserrat||||||||” header_4_font=”Montserrat||||||||” custom_margin=”-10px||1px||false|false” global_colors_info=”{}”]<\/p>\n [\/et_pb_text][et_pb_text _builder_version=”4.16″ text_font=”||||||||” custom_margin=”|0px||0px|false|false” border_color_all=”rgba(0,0,0,0)” border_style_all=”none” global_colors_info=”{}”]<\/p>\nThe Team<\/h4>\n
Remote:<\/strong> Product Owner \/ Back End Developer x2<\/span><\/p>\n\n
\n
Users and Audience<\/h1>\n
Ben<\/h3>\n
Career focused, working long hours away from home<\/p>\nGoals<\/strong><\/h4>\n
\n
\n
Isaac and Erin<\/h3>\n
Spend most of their time at home or visiting friends and relatives<\/p>\nGoals<\/strong><\/h4>\n
\n
\n
Paul & Maya<\/h3>\n
<\/span>Renovating their home takes the majority of their spare cash<\/p>\nGoals<\/strong><\/h4>\n