Personalising team spirit.

Perficient Digital uses its accelerated modelling process (CX AMP) and Adobe XD to reimagine the online customisation experience for retailer Lids.

logo

Established

2016

Employees: 350
Atlanta, Georgia
www.perficientdigital.com

4

Weeks to develop working prototype

tickbox icon

Objectives

Help clients order customised items online

Design prototypes quickly and efficiently

Secure feedback from real customers

Support new agency offering for clients

graph icon

Results

Developed working prototype in 4 weeks

Secured immediate feedback from clients

Helped launch new offering to grow business

Tested working prototype with customers

Helping fans express their passion

Sports fans are passionate about their favourite teams and nothing lets them express that passion better than customised apparel. For many, the simplest way to represent their college or professional team is by wearing a hat emblazoned with the team logo. Speciality retailer Lids, a leader in fashion athletic headwear, team apparel and other fan novelties, offers a range of customisable hats and other items that let people show their support and express their individuality. 

 

Lids has an active online presence, but what sets the retailer apart from its competition is the more than 1,000 brick-and-mortar locations in the United States, Canada and Puerto Rico. To update the look and feel of some of its online and mobile products and take advantage of the immediacy that its retail locations offer, the company engaged creative digital agency Perficient Digital, part of the digital transformation consulting firm Perficient.

 

The business innovation group within Perficient Digital began working with Lids on a digital strategy that focused on growing online customisation. Previously, Lids only offered customisation in its retail shops. The company’s new strategy includes offering customers the ability to order a hat online, customise it with a player signature, mascot or other item embroidered on the side and have it fulfill from a distribution centre. The ability to offer online customisation is a great differentiator for Lids.


“Adobe XD helps us build a foundation for a project rather than just delivering a strategy document. Instead of just talking about personalisation and what it means to a user, for a low investment we can show clients the vision.”

 
Brian Flanagan

Director of Experience Design, Perficient Digital


A simple path to customisation

Perficient Digital set out to create the Lids Customised Zone, an online experience for placing customised orders that would work with the client’s existing front-end and back-end processes. The team focused on using design thinking in conjunction with Adobe XD, part of Adobe Creative Cloud for teams, to create the wireframes and prototypes.

 

The prototyping process took four weeks and included a kickoff workshop, initial sketches, delivery of a mobile prototype and securing both client feedback and input from actual customers in Lids shops. The last stage was determining how the mobile experience would work on a desktop.

 

“We focused on mobile first because there are more constraints with mobile,” says Brian Flanagan, Director of Experience Design at Perficient Digital. “Adobe XD let us take a leaner, guerilla-style approach, validate ideas quickly and move on.”

 

The goal of the online experience was to empower individuals to express themselves by creating a customised hat. The team distilled two concepts from the initial design sketches, then created the prototypes in Adobe XD. After reviewing with the development teams for feasibility, they moved forward with testing. The experience design process also involved using Adobe Illustrator for graphic design and Adobe Photoshop to clean up icons and get them ready to use in Adobe XD.

 

Knowing that the embroidery machines work like stencils in how they plot out stitches, the team created a flow where customers would select a layout that included text, a graphic or both. For example, in the prototype, customers could select the graphic of an eagle’s head and customise a range of options — from the colour of the eagle’s eye and feathers to the style and colour of the typeface — all within a web browser on a mobile device.

 

The team found Adobe XD to be light and easy to use and the artboards helped them to see how the interaction would work from screen to screen. They also appreciated the ability to simultaneously do interaction and visual design in Adobe XD, rather than relying on a waterfall process. 

Real-world testing and feedback

The four-week timeline was aggressive to conceptualise, create, test and modify the prototype, so it was important to be agile. Weekly meetings with UX and visual designers helped move the project forward and the client appreciated the hands-on approach to reviewing the prototype and the ability to see iterative revisions. One of the most exciting parts of the project was taking the prototype into actual retail shops and asking customers to test it and give feedback. 

 

Adobe XD enabled the team to create a link and view the prototype on a phone, hand it to the client and get immediate feedback. It also let them work in mid- to high-fidelity, so when they took the prototype out in the public it looked and felt like a real product.

 

The prototype included 60 screen variations, which were easily created due to the ease of the Adobe XD workflow. The team was able to hand off all asset files as .svg files, along with a style guide and the individual components for development. Lids plans to launch the new online experience in the fall of 2017 in advance of the holiday shopping season.  

 

“With Adobe XD, we were able to quickly prototype and test the solution with actual customers, which allowed us to better understand their behaviour and fine tune the experience to meet their expectations,” says Steve Wentzell, Senior Director, E-commerce at Lids Sports Group.


“With Adobe XD, we were able to quickly prototype and test the solution with actual customers, which allowed us to better understand their behaviour and fine tune the experience to meet their expectations.”

 
Steve Wentzell

Senior Director, E-commerce, Lids Sports Group


Driving the business forward

Adobe XD is part of Perficient Digital’s new customer experience accelerated modelling process (CX AMP), which is helping the agency win and grow its business by quickly defining a strategic vision for clients. The team recently built out a next-generation intranet project for a large publisher that will help the company better engage its 45,000 employees. They also created both technical and visual prototypes in Adobe XD for an employee benefits company to help improve enrolment. 

 

“Adobe XD helps us build a foundation for a project rather than just delivering a strategy document,” says Flanagan. “Instead of just talking about personalisation and what it means to a user, for a low investment we can show clients the vision, which leads to a roadmap for the future. Adobe XD has added a lot to our offerings.”

About Perficient Digital and SoDA

Perficient Digital is a member of SoDA, an exclusive global network for digital agency leaders, creative visionaries and technology innovators. With a 100+ member companies in more than 30 countries around the world, SoDA’s programmes provide agency executives with access to a powerful, global network for peer collaboration, thought leadership, knowledge capital, leadership cultivation and industry best practices. More at www.sodaspeaks.com and www.sodareport.com.

Recommended for you

Let’s talk about what Creative Cloud can do for your business.

Let’s talk about what Creative Cloud can do for your business.