There are a couple of tools that I always end up coming back to and I like to keep track of them, here are some of them:
Prototyping Tools:
- Figma → simple mocks, can handle a lot of different screens/mediums, you can even pair bluetooth controllers like JoyCons if you want to prototype game UIs without jumping in Unity.
- Axure RP → advanced mocks, form heavy mock-ups
- Webflow/Framer → if you really want to have an almost ready product you can use CMS to prototype websites/apps, I’ve found them useful to prototype websites and responsive design (going from web to mobile view)
- Lovable → Still trying out, I’ve been focusing on my freelancing and this seems like a tool that a lot of other freelancers use as well as other designers in the field.
- Flutter/Kotlin Jetpack Compose → There was a time I was interviewing for an UX Engineer position, this role primarily focused on implementing UI components, and to practice/try it out I used Android Studio w/ Kotlin and Jetpack Compose to prototype a Wearable app. I was able to prototype a simple cat feeding reminder, but it was pretty easy/quick to set up with some coding knowledge, plus there is not that many tools that offer prototyping capabilities for Google Wearables just yet. I have tried a very simple IDLE reminder with the Apple Watch on my portfolio, but feel free to check it out.
Design Tools:
- Adobe Creative Suite → Most well known, paid, but it gets the job done specially Illustrator for specific tailored UI assets. Adobe is good to create realistic mocks of your apps/products.
- Affinity → Recently switched from Adobe since it opens .PSD files and other adobe extensions, for free! Been utilizing it a lot and no complaints so far.
- Procreate → I use it on my iPad to draw, sketch features/screens, and because it has the timelapse feature, if I remember drawing something that I ended up deleting I can see the recording back. I also use it if I want to make even more custom UI assets, for example for the Eco-Warriors project I created.
Animation Tools:
- Adobe After Effects → Again pretty well-known, but paid, used it for a bit, but got complex pretty quick, and I found other tools to make my animation work quicker than with AE.
- Jitter → Online tool? Free, but paid for higher quality, I used it for a lot of my Lottie animations for my portfolio, the Lottie animations are sharper and cleaner to handle than GIFs or .MP4s, so I primarily use Jitter. A lot of the simple animations that I wanted for my portfolio were more easily done here.
- CapCut → Another great free video editing tool, I’ve used the mobile CapCut for content creation (vlogging) and I had a positive experience. Found out there was a desktop version and it has worked pretty well for me to create video mock-ups for apps/desktops when I don’t have access to the Figma prototypes I worked on.
AI Tools:
I do not encourage AI being used for art creation, given that I create art myself, however, there are many ways in which you can use AI in your advantage.
- Claude → I prefer it over ChatGPT, it does great to provide additional interactivity and to create visual mocks. I personally use it a lot to add additional interactivity to my portfolio, for example making it so when you click on an image you can expand it, or if there are things that are not working on mobile-view it can fix a lot of responsive bugs.
- ChatGPT → I primarily use it to generate text, and summarize ideas/articles I see online. I’ve also done data cleaning for multiple files for UX research purposes, but I check that the scripts that is running is changing the right things and not mudding the data.
- Nano Banana → I tried creating realistic mocks aka someone holding a phone with one of my app designs, doesn’t work too well, however, I’ve find it useful if you have really bad quality images of your work and you want to make them more HD and it has helped me then.