Rebuilding the ArcGIS Thumbnail Builder
Many years ago Joshua Tanner published a clever little tool called the ArcGIS Thumbnail Builder. It was a browser-based canvas app for creating item thumbnails for ArcGIS Online/Enterprise. It was simple, useful, and built with the tools of the time.
I've been using it on and off ever since, and recently decided it was time for a ground-up rebuild. The result is ArcGIS Thumbnail Builder Next.
https://ope.nz/tools/thumbnail/
What's new
The original tool was built with Materialize CSS and a handful of query string parameters. It did the job, but there was a lot of room to grow.
A proper UI framework
The rebuild uses https://getuikit.com throughout - cards, modals, grid, form controls. The layout is responsive, so it works on a phone or tablet without the fixed sidebar getting in the way.
Full colour control
Every element of the canvas has its own colour picker, powered by https://simonwep.github.io/pickr/. You get a full classic picker with HEX, RGBA, HSLA, HSVA, and CMYK input modes.
The https://colorbrewer2.org palette selector lets you load a named palette and have its colours populate the swatch row across every picker at once - handy for keeping things harmonious.
Phosphor icons
You can now use any of the 1,530 icons from https://phosphoricons.com as a logo or as a large centred background watermark. There's a searchable picker modal, so finding the right icon is quick. Phosphor is a clean, consistent icon family.
Pexels photo search
Need a background image but don't have one to hand? There's a built-in Pexels search. Enter a keyword, get four photos back, pick one. It fetches the image and applies it to the canvas at the right dimensions.
Bring your own free API key from pexels.com/api - the Ope hosted version has a baked-in API key, so please don't abuse it :(
Themes
Your settings are saved to browser localStorage automatically. You can also export a theme as a JSON file - colours, icon selections, and the background image are all included - and share it with someone else. Importing it applies everything instantly.
Two canvas sizes
ArcGIS Online uses different thumbnail dimensions for items (600×400) and groups (400×400). A radio button switches between the two, and the layout adjusts accordingly.
Try it
The tool is hosted at https://ope.nz and is entirely client-side - no server, no accounts, no data leaves your browser (except the Pexels API call if you use that feature).
The source is available. Its straightforward vanilla JS and HTML
Built by https://ope.nz - original concept by Joshua Tanner.