I’m wondering about the best way to store the images I have so I could possibly(?) randomize them when the app is opened.
Also wondering if there is a way to animate an image (card flip/reveal) as it appears…I see that Lottie’s an option, but I have no experience with it.
Any advice and recommendations are appreciated 
2 Likes
If you have a predefined set of images then you could use Airtable tables and save the images in the Attachment field. You can then refer the those images by the URL that will be supplied by Airtable.
Cloudinary is another option and you can upload images at run time (images selected by the user for example). Again you will reference the image by the URL returned from Cloudinary.
3 Likes
Yep, in addition to what @muneer said, you also have the option to upload them directly to the project/app as assets. The limitation, of course, is that you won’t be able to add or remove images from the app without publishing an update to the app store(s). But the display of those images will be faster than a cloud solution.
Cloudinary is really nice because you can do image transformations using simple url codes. So doing something like displaying a lower-quality or smaller or cropped or rotated image is really pretty easy.
Lottie animations aren’t too difficult to add to a project. There are examples of how to do this on the forums and in the documentation.
And yes, you can randomize just about anything you like in Thunkable: list items, row #s, column #s, image filenames, etc. The List and Text block options are very robust.
3 Likes
@muneer and @tatiang , thank you both very much! Great ideas. I am leaning towards baking them directly into the app. They are images of rank in the Canadian Armed Forces and will likely never change 
@tatiang, is there anything I should know about uploading them assets for the project?
Yes, I’d go with a direct upload then.
The only things that come to mind are that your app has to be smaller than 50 MB and also that if your images are going to be relatively small on the screen, you can get away with uploading small and/or lower-quality images, thereby saving space and slightly speeding up the loading of those images (more about space than speed).
If you want to display a random image, it will be very helpful to name the images sequentially.
For example, you might have filenames like badge1.png, badge2.png, badge3.png, etc.
Edit: on my phone, the names above show up with long URLs… not sure why but I just meant you can name an image something like “batch1” or “batch2” to keep it sequential.
That allows you to change an image or button component’s picture to join [“badge”]+[random number]+[“.png”]. There’s a random number block in the Math drawer. The Join block is found in the Text drawer.
2 Likes
What I am picturing is this:
- User presses ‘Start’ button - this causes an image to appear, two ‘choice’ buttons, and starts a countdown timer.
- Once the image has appeared, the start button disappears.
- Each ‘choice’ button is labelled with a rank. One is correct, one incorrect.
- User presses one of the buttons before countdown timer reaches zero - not sure how to display a countdown timer to users
- If correct, reward screen, then user taken to game screen with Start button visible again.
- When start button pressed, new (random) image and Choice buttons appear,
- If incorrect button pressed, feedback screen, user taken to new game screen with Start button visible.
Tracking their incorrect choices and being able to review those would be good in the future.
Very doable. And there are tutorials and demos for this sort of thing. You might start by Googling quiz Thunkable.
Hey @josh, The way you can do this is : (Good idea of an app, by the way).
Add a label and try making a function like this -
P.S - You can change the “if label text = 10” to any no. of your choice. I would also like @tatiang (And you also, if you want) to help me fix the label problem, as when i click on the button, The count starts from 2, not one
keep thunking,
Anush
What is the starting value of Label1’s Text? In your block example above, it should be zero. But also, you want to wait 1 second before changing the value… not after.
Hey Anush, that’s really cool, thank you for sharing it!
I really want to show my app off to my division CO once I get the Navy ranks done. I’ll have to do the Army and Air Force next, but I work for the navy, so we get to go first
2 Likes
https://x.thunkable.com/projectPage/5e9f43cacdefcd093a4d78ce
^Just gonna drop this here, hopefully it works
2 Likes
Thanks Jared - I’m going to have a look at how that was put together and see if it can help me with my design.
1 Like
Hi Anush, how would you set it up the timer to stop (and reset) the timer when an answer is selected, OR if no answer is selected, run down to zero and reset?
Hi @Josh,
See this and modify it to your needs.
https://x.thunkable.com/copy/b15a166a8f199ebdd8d27cc7a0bc2f52
A screenshot if you’d like to just see it from here.
Hope that helps!
1 Like
Hi @human That looks like it will do the trick nicely! Thanks very much! I’ll give it a try and see how I do
2 Likes