Hi all! As mentioned in my previous Creator Lounge post, I recently redesigned the entire user interface of my flagship app, Veggie Alternatives, with Thunkable X. Here, I’d like to share two aspects of that for anyone looking for where to start: how to get inspiration for your user interface and how to find royalty-free images/other assets for your user interface.
Before I get into those, here are some before and after pictures of the Veggie Alternatives interface:
I’ll admit that the interface wasn’t very appealing at all before the redesign – I focussed too much on functionality and not enough at all on design. So here are some (very) simple tips that I used to get inspiration for my new user interface – I’m guessing many of you already do these things:
Part 1: How to get inspiration for your user interface
- Look at successful apps in your industry, and analyse/get ideas from their user interfaces. A good look is essential for an app that is going to be consistently successful – you can find many examples through simple searches on the App Store or Google Play. For example, in designing a Food & Drink/Lifestyle app, I looked at examples such as Just Eat and Uber Eats for inspiration.
- Look at examples of material app design and try to implement/recreate aspects of these in your Thunkable app. Just a simple Google search can work wonders to get your creative juices flowing. You can also look at various posts on this Community, such as this, this, or this! I tried to go for material design with my new home screen:
- Once you’ve done some work on your user interface (if you need any help during this, you can always ask the Community), ask people for feedback! This could include your family, friends, and/or of course us in the Community – since ordinary people are going to be the ones using your app, you should ask them (perhaps with a focus on your target market) whether they like your current design or if they have any constructive criticism for you.
Part 2: How to find royalty-free images and icons for your user interface
There are a number of ways to do this, depending on what you’re looking for. Here are some tools and sites that I use (if you do use these tips, please make sure that you’re still double-checking the sorts of licencing rights you have to the images you find!):
For images: you can filter a Google Images search for images that are ‘Labelled for Reuse’ and various other factors. To do this, go to Google Images > Tools > Usage Rights > Labelled for Reuse. You can also see the image below!
- For images: many stock image sites host images that you can use either personally or commercially in your apps. Examples include Unsplash, Pexels and Pixabay.
- For icons: similar to stock images, many sites provide icons that you can use for free (sometimes with attribution). Examples include Flaticon and Freepik.
- For icons: create your own! Okay, so this isn’t strictly ‘finding’ the assets – but even on software as simple as PowerPoint, you can create your own icons using their various ‘Shape’ and ‘Design’ tools.
- For animations: Thunkable supports the brilliant Lottie animations – on their site, there are tons of free animations available for you to use in your app – but, as always, make sure to check the licensing for any animations that you use!
That’s all for my fourth Creator Lounge post – if you’re reading this, I hope you’ve found it useful! If you have any specific queries, feel free to send me a message.