Product review of Wondershare Mockitt — the new design tool in town

and how it compares to Adobe XD and Figma while designing Lyrics by Spotify

Logos from left to right: Adobe XD, Wondershare Mockitt, Figma

So how does Wondershare Mockitt compare to other tools?

I decided to test it out myself — I built my passion project, Lyrics by Spotify, in Wondershare Mockitt, Figma, and Adobe XD. As I first learned how to wireframe and prototype in Figma, I built it there first before doing so in Adobe XD and Wondershare Mockitt.

Figma prototype of Lyrics by Spotify

Creating a new project

When you create a new project in Wondershare Mockitt, you will see this screen:

“Create a New Project” screen where you can choose the device and dimensions of the product you want to design
What you would see after clicking “Create” for an iPhone 12 MAX/12

Features that I loved

Adjusting screen sizes

When you extend the height of the screen on Figma and have assets on it, the assets stretch with the screen, unless you hold CMD/CTRL while doing so. Similar to Adobe XD, Wondershare Mockitt allows you to extend the height of your screens without stretching your assets or having to hold CMD/CNTL while extending it.

A library full of templates and assets

Wondershare Mockitt’s built-in library of assets and templates you can use and quickly add to your screens
“Mine” tab of the library where you can upload your own files by dragging or clicking “Upload Image”

Screen States

Left: Wondershare Mockitt “screens and frames.” Top right: Figma screens. Bottom right: Adobe XD screens


Prototyping in Wondershare Mockitt: Drag the lightning icon to the left screens panel
You can specify the type of “tap” to trigger your “event” (i.e. double tap, swipe, tap and hold)

Features that I liked but could be improved

Fixed slider

The fixed slider was really easy to use and made it easier to differentiate which items should be fixed when scrolling. I loved that I didn’t have to go into each component to make sure that I checked the “fixed position when scrolling” box and specified the constraints (top, bottom, left, right, etc.) like I would have to do in Figma. Similar to Figma where you extend your screen to however long you would like and select what you want to be fixed when scrolling. This is also probably one of the reasons why I love Adobe XD’s scrolling groups.

Left to right: Adobe XD, Figma, Wondershare Mockitt playlist screen


Widgets are Wondershare Mockitt’s version of components and like Figma and Adobe XD you can create different states (Wondershare Mockitt = widget states, Figma = variants, and Adobe XD = component states). If you are using widget states, it seems like you can only have 2 widget states; I’m not sure if this is a limitation to my account type (free vs. paid) or the version of Wondershare Mockitt (online vs. desktop) that I’m using.

Features that I would love to see in Wondershare Mockitt in the future

Import CSV files

Figma and Adobe XD both have plug-ins where you can import Google Sheets and CSV files into your designs. I did that to quickly populate the playlist screens with artists, song titles, and their respective album covers. Since this was not an option for Wondershare Mockitt, it took a little more time to edit each widget.


Gradient fill is currently unavailable on Wondershare Mockitt, which is why the background color for my screens are different for my Wondershare Mockitt prototype.

Magic Move between screens

Adobe XD prototype of Lyrics by Spotify: smoother transitions because of Auto-Animate

Eyedropper tool

Screenshot of the error message: Eyedropper tool only available through the Wondershare Mockitt Desktop App

Rounded ends for lines

When you use the line tool on Wondershare Mockitt, it does not give you the option to round the ends of the line. It was something I was looking for when designing the slider for my prototype, but couldn’t find, so I used a rectangle and rounded the corners as much as I can instead.


Adobe allows you to drag guides, “lines that you can superimpose on your artboard that help shape your design and plan where elements will fall,” in all of their application. You can probably tell by now that I love grids, guides, and precision, which is why I would love it if both Figma and Mockitt Wondershare had this feature.

Zoom beyond 400%

I like zooming into my designs to make sure that all my components, texts, images, etc. are aligned perfectly to my grid layouts. You currently can only Zoom in up to 400%, but again, this is just my personal preference.

Designing to the closest 0.01px

Similar to Wondershare Mockitt, Figma, and Adobe XD snaps to the closest pixel when you create and move objects. However, the latter two allow you to design to the closest 0.01px if you manually change the pixels in their respective right panels. Although it’s recommended to always design to the closest pixel, I would like the option to design to the closest 0.01px as I can in Figma and Adobe XD.

Final Verdict

Wondershare Mockitt prototype of Lyrics by Spotify
  • I partnered with Wondershare Mockitt for this product review and was given complete freedom about what I can write about. This is an honest review of the product, and I built the same project in all of them (but I created all the icons in Figma, saved them as SVG files, and used them in my Adobe XD and Wondershare Mockitt prototypes).
  • I do not work at Spotify. I use Spotify often and missed having lyrics to the songs available to me while listening to them like I did when I still used my iPod and music streaming was still a new thing. I use Spotify a lot, and wished that they had that option especially because some other apps do — so I built my own!
  • Album covers and music belong to the artists and their respective companies; I used them to make my prototype more realistic.



UX Designer who challenges the status quo by building creative solutions through design. Check out my portfolio:

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Tiffany Goh

UX Designer who challenges the status quo by building creative solutions through design. Check out my portfolio: