Designing websites with Adobe XD

With designer Lizi

Lizi has worked at FIG for 18 months and is an experienced graphic and web designer. Recently Lizi has been updating her skills by using Adobe XD in her web design.

We caught up with her to find out more.

What is Adobe XD?

Adobe XD is a user experience design tool that helps designers create quality website and mobile app designs. Adobe XD allows designers to share their design prototypes with the team and clients across a multitude of devices and platforms. It integrates with the rest of Adobe Creative Cloud and is compatible with many of the Adobe libraries.

What are the benefits of using Adobe XD?

• Visually accurate and interactive
  
  
• XD allows the designer to create a tangible and interactive design concept for the client enabling them to truly understand and appreciate your interpretation of the brief. It gives the client an accurate experience of how the project will work.

• Fast, accurate feedback
  
  The sharing tools on XD allow instant, interactive access to the prototype for anyone involved in the project with the capability for annotating feedback directly onto the shared prototype. It means changes can be actioned quickly and reduces the chances of misunderstanding and communication errors between client, designer and developer. Overall, achieving a much improved client experience.   

• Efficient, consistent design process
  
  
• The ‘Component’ function is particularly useful when making changes to a design. Any changes made to the master component amends all the child components across the design, massively speeding up the process and ensuring consistency throughout. This lets the designer focus on exploring what the best design for the brief could be and then visualising it and seeing how it will work across the entire design.

• Smoother web process between designer and developer
  
  By simplifying the process of designing, XD allows for faster design; enabling for more of a project to be designed, leaving less guess-work for the developer. Transitions, for example, can be fully be explored by the designer and signed off by the client before the project is passed onto the developer, utilising the developers time to the fullest.

• Familiar, intuitive interface
  
  For a designer, the interface is familiar and intuitive, making it easy to transition from other Adobe software. And because XD integrates with the rest of the Adobe Creative Cloud you can quickly import Illustrator and Photoshop assets.

What features did you like and has it changed the way you approach web design?

I love XD’s Prototype function and how it allows you to map out the digital journey. I also appreciated that by keeping the interface simple you can focus on the actual design, so the whole process becomes seamless and integrated. Working on XD allows me to think much further ahead in the project and consider design elements of the whole website rather than in isolation. Being able to create a functioning prototype of my web design quickly and efficiently is a satisfying feeling. And so was getting a really good response from our client!

Adobe XD has changed the way we work and think about websites, I can’t wait to get stuck into our next website project.

If you want to find out more about Adobe XD or web design contact FIG on 01457 857111 or take a look at our web portfolio.