Navigate to your ClickUp workspace in https://app.clickup.com/.
​
​

Navigate your client's dev list and look for the task that needs to be reviewed.

Open the preview link and make sure that you see the preview bar at the bottom of the page.

Start navigating the preview link until you get to the feature that needs to be reviewed (in this case- Checkout Value Propositions).

Once we have displayed the feature that we will be QC’ing, we will open another tab with the figma file containing the design and open it from the editor.

At this point we should have our preview link open in one tab and our design file open in another tab, this will make it easier when comparing design versus development.
​
​

With our preview link open, we will right click the mouse and click on ‘Inspect’. The inspect tool is super handy for QCing because it allows us to zoom in and spot even the tiniest elements within a site. Plus it also allows us to see how the development would look for different devices (mobile, tablet, etc).
​
​

Now we will begin inspecting the different elements of the development and start comparing them with the approved design proposal. At the right side panel of the browser, click on this icon and start hovering the cursor over the different elements.
​
As you hover over the cursor, the specifications will start showing up.

As we start to review each of the development specifications, we will do the same thing within our Figma design, by clicking on each of the feature elements and reviewing the specifications.
​
In this step, we want to ensure consistency of elements such as:

Now let’s take a look at the icons for example.

We will do the same process for each of the different elements in the feature and don’t forget that if the feature is somehow clickable, animated or has a specific functionality that is something we would like to review as well when QCing.

If you think we are missing something, the answer is YES! 👀
​
We still need to take a look at how the feature is looking for the mobile version. For which we will go back to the inspector, click on the icon at the right side panel of the browser, select the mobile device and follow the same process for review.
​
​
​
​

We will continuously compare development versus design.

There is no such thing as over QC’ing so we might want to switch to different mobile devices and make sure our feature is working properly. This can be done by clicking on the top inspector menu.
​
​
​
​

Last but not least, if after QC’ing you find some edits for the dev to work on (design or functionality) please make sure you also leave the comments in the ClickUp ticket. This will help us keep track and visibility.

​
Process Owner: Mafe Arbelaez
Last Update: 4/2/24
​SOP HERE
​