Search Icon A magnifying glass icon.
Search Icon A magnifying glass icon.
Subject
Admissions

DEGREES

Next Start:
January 6, 2025
Next Start:
January 6, 2025
Explore Graphic Design Degree Courses
Discover Sessions Graphic Design Hub

Professional Certificates

Next Start:
December 1, 2024
Explore Graphic Design Career Courses

DEGREES

Next Start:
January 6, 2025
Next Start:
January 6, 2025
Explore Web Design Degree Courses
Discover Sessions Web Design Hub

Professional Certificates

Next Start:
December 1, 2024
Explore Web Design Career Courses

DEGREES

Next Start:
January 6, 2025
Explore Digital Media Degree Courses
Discover Sessions Digital Media Hub

Professional Certificates

Explore Digital Media Career Courses

DEGREES

Next Start:
January 6, 2025
Explore Digital Media Degree Courses
Discover Sessions Digital Media Hub
You can deepen your software skills and keep up with the latest Adobe CC updates in our online Digital Arts courses.
Contact Admissions

DEGREES

Next Start:
January 6, 2025
Next Start:
January 6, 2025
Explore Digital Photography Degree Courses
Discover Sessions Digital Photography Hub

DEGREES

Next Start:
December 1, 2024
Explore Fine Arts Degree Courses

DEGREES

Next Start:
January 6, 2025
Next Start:
January 6, 2025
Explore Illustration Degree Courses
Discover Sessions Illustration Hub

Professional Certificates

Next Start:
December 1, 2024
Explore Illustration Career Courses

DEGREES

Explore Advertising & Marketing Degree Courses
Discover Sessions Advertising & Marketing Hub

Professional Certificates

Explore Advertising and Marketing Career Courses

CERTIFICATES

Next Start:
December 1, 2024
Next Start:
December 1, 2024
Next Start:
December 1, 2024
Explore Sessions Career Courses
Professional Cert PLUS
Next Start:
December 1, 2024
Next Start:
January 6, 2025
Next Start:
January 6, 2025
Next Start:
January 6, 2025
Explore Sessions Bachelor's Degrees
Next Start:
January 6, 2025
Next Start:
January 6, 2025

WWW…Wednesday! Percy: Visual Regression Testing

by Taylor Slattery | November 13, 2019


Small changes made to the visual appearance of a site can cause unintended consequences. Elements can move out of alignment causing difficulty for users. Humans are prone to error, and if left up to us, these often subtle mistakes can go unnoticed. Percy is an automated quality assurance tool that does the job for you. It uses snapshots of your site or app as master documents to compare all future changes against. It analyzes them for differences and notifies you of any it detects, for you to either approve and proceed with the roll-out or amend your code.

percy-changes-dashboard

To ensure a consistent customer experience, Percy compares snapshots across all major browsers and also includes responsive testing, to make sure UIs work on both mobile and desktop. In addition to checking visual differences, Percy can check components and their functionality. Naturally, most web development work is a group undertaking, and thankfully Percy has an integrated suite of tools geared towards collaboration, allowing for members of the team to leave comments and notify others of any changes. It also stores a record of previous edits which is helpful for troubleshooting further down the line.

percy visual diff

Percy is useful for large and small teams alike. Time is precious and trying to manually review changes across every page, supported browser, and use case, is a huge drain on time and resources. Percy is quick and simple to use. After the hard coding work is complete, teams can perform visual consistency tests and have their results in a matter of minutes. Percy is used by companies like Google, Canva, and Shopify, with engineers on all of their teams singing its praises. For large companies like these, with even larger user-bases, maintaining style guides is of the utmost importance. Manually checking updates prior to roll-out can prove to be next to impossible. Percy helps developers to feel more confident whether making major changes to a UI or just shipping small updates.

percy change timeline

Its pricing system works on a per-snapshot basis, with a free plan allowing for up to 5000 monthly snapshots and a team of 10 members. You can sign up for Percy or learn more here.

 

Taylor is the Managing Editor of Notes on Design. Taylor is a graphic designer, illustrator, and Design Lead at Weirdsleep.

 

This blog is powered by Sessions College, the leading online school of visual arts.

[Modal-Window id=”1″]

©2024 Sessions College for Professional Design  All rights reserved

Terms & Conditions       Privacy Policy