Tag: ai

Posted on
by
grid of four abstract images of flowers with swirling blurs of yellow, orange, and brown, created by deliberate camera movements

So yesterday evening I was waiting for my wife to join me to watch the TV. Earlier in the day I’d looked at the Daily Create. This was a challenge to use ICM. I read the suggested information on Intentional camera movement and realised I had none of the suggested equipment. A quick search found several articles about using the Slow Shutter app on an iPhone. I not only had my phone in my hand, I already had the app.

As it was dark outside and I only had a few minutes, I played around with a vase of daffodils and a bunch of dried flowers in the living room. I can’t say I was completely enamoured with the results, but could see it might be fun to play around some more.

I thought to share one of the photos on Mastodon in response to the Daily Create. Looking at the pictures I’d taken I thought a grid of four might be nice. I could have just uploaded four photos to a toot, but decided to run a shortcut to combine the images. It then turned out the shortcut was broken. I had a quick look and it seems okay, but it was old. I’d not used it for a few years. Not being one for shortcuts I didn’t think I could fix it in the couple of minutes before my wife arrived and we would start watching.

If I’d been on my Mac I’ve got many ways of doing this in less than a minute, but I am on my phone. I briefly thought of combining in Keynote and exporting but that would be a faff on the phone.

I then thought Claude AI could probably make an artefact that I could use. Of course I could have just asked Claude to make me a combined image, but that, for some reason, didn’t cross my mind. I guess there are a myriad of websites that would do the same too.

Can you make a one-page website that will allow a user to select images and turn them into a grid to download

After that, I had to report the download didn’t work on my phone, twice, before the working webpage was made. I used the artefact to make my wee grid and popped it onto Mastodon.

It took me a couple more minutes to copy the code and add it to my Raspberry Pi, without leaving my chair. The Termius app let me connect to the Pi, create a new file, and paste in the code. Image Grid Creator.

I guess in a few more minutes of internet time, this sort of ridiculous workflow will be simplified and everywhere.

Like everyone else, I’ve been reading a lot for and against AI. I think it is very hard for most of us to know where this is going. I’ve not really dived in, but I’ve not ignored it. I’ve not paid for it either.

I’ve used AI to help think through options for buying a car, made a few web pages, and consulted it on shell commands and regex. I’ve enjoyed using it most when I’ve made something myself, but discussed approaches, asked for code snippets, or syntax checking of my own failed snippets.

The latter is where I’ve enjoyed it most. There is a lot of satisfaction in getting markup or simple JavaScript to work. It is not work for me but a wee hobby. Handing over to AI completely would not be much fun and would have a lot less satisfaction.

I’ve also enjoyed using telex.ai to make simple WordPress blocks. This process would be beyond my skills, but I can act as a product owner. I also know enough to stop telex running in circles.

Where this leaves us, I’ve no idea. Watching politics live on the BBC this lunchtime, I was not impressed with any of the politicians’ responses to questions around getting AI to pay for creative content it has scraped. I can’t say I’ve a better idea or understanding. Certainly interesting as well as ridiculous times!

Posted on
by
sepia Illustration of an Indian elephant with background structures and a smaller scene with another elephant and men. t from Dictionnaire universel d'histoire naturelle 1847

I used to love Martin Hawksey’s tweet archive which I used for quite a while and mirrored on the web.

Yesterday I was reading Alan’s post: My Digital Cleanup: IFTTT – CogDogBlog which explains how he now archives toots with make.com a sort of ifttt replacement. This sounds very useful. I’ve quite often failed looking for old toots with the mastodon interface.

This made me think a bit. I’d been playing with json to sqlite for my flickr photos, On this Flickr Day. I wondered if I could do this with my toots too.

Turns out I could take a very similar approach:

  1. A bash script pulls down all my previous toots to a sqlite database.
  2. Another script updates the database.
  3. A php file provides a search and display.
  4. The search can be viewed in the browser using a simple php server.

There are a few things that could be improved.

  • I’ve not used any authentication. So I just get public toots and boosts. That is all I want.
  • The web page produced is pretty simple, if there is no search it shows all my toots. This is just over 1000 I probably need some pagination.

I’ve a version running on my raspberry pi. Search Toots this is organised slightly differently from the one I run locally on my mac. The scripts & database are not directly in the public_html directory.

I’ve put the files on github: troutcolor/localtoots in case anyone is interested.

I had a bit of AI help, bouncing ideas, tidying things up & especially all of the getting the files on git hub. I’ve done this so rarely I’d no recall of how to do it.

Featured Image: n92_w1150 | Dictionnaire universel d’histoire naturelle :. P… | Flickr Public domain by Biodiversity Heritage Library

Posted on
by

Likes What technology takes from us – and how to take it back | Rebecca Solnit.

Someone told me that her friend was having a chatbot write her husband a poem for their anniversary, which made me wonder if the husband desired a polished product or an expression from the heart. In Edmond Rostand’s 1897 play Cyrano de Bergerac, the big-nosed title character ghostwrites love letters for his friend to the Roxanne both of them love. She comes to realise it’s the author of the letters she really loves. What happens when you realise the true love who touched your heart is’nt even human? Accepting it as your Al lover seems to be one answer.

I enjoyed the comparison of ai with Cyrano, and the rest of the article was striking.

Posted on
by

I am pretty pleased with On this Flickr Day and already find it fascinating to see photos from the same day across the years.

I left this with a few todos and have made progress.

  1. Create a way to produce JSON rather than a web page with PHP. I could then bring the thumbnails into this site using JavaScript.
    • Was fairly simple when I found json_encode($data,JSON_PRETTY_PRINT); for php. That could be fetched with JavaScript from my new index page.
  2. Add some sort of lightbox to see the images larger.
  3. Change the layout & appearance.
    • Worked a little on this especially for mobile. Using a css grid on desktop. I want to keep it as simple as possible.Still need a bit of a tidy. While I was searching I found out about Masonry which look like a nice way to go eventually. Introducing CSS Grid Lanes | WebKit is a good read.
  4. Figure out a simple way to update the database without completely rebuilding it.
    • Just checking the last 100 photos on flickr once a day with a cron job. I just truncated the original script that built the database. I’ve uploaded a photo or two most days recently and it seems to be working. I could probably cut the numbers checked to 50, as I don’t upload many photos.
  5. Decide on any extra fields and recreate the database.
    • Not done, but I think I want to add in a smaller image size so I can pull the json into WordPress and add tiny thumbs to my on this day page.
  6. Figure out why I can’t get location information from the database with PHP I can with bash.
    • This sorted itself out once I check there was some location data for the image in the json when it is received.

I’ve continued to talk to claude.ai a bit in the process. But I’ve been careful to ask for it to discuss approaches & not give me code. I’ve tried to describe my ideas and situation and finish with Can you run through some options & idea, without code? or similar. This has been really helpful. I continue to search for answers to problems with DuckDuckGo too as in the pre ai days.

Posted on
by
Screenshot of On This Flickr Day webpage

On This Flickr Day There is a bit more work on making this look nice, but it is a start.

I’ve been thinking about this for a while. A way to show Flickr photos taken “on this day”.

I’ve used the Flickr API occasionally over the years, but calling it directly would take too much time. You would need to page through all the photos 500 at a time until you had all the photos.

So I thought I might build a personal database with the information I needed. This could be updated weekly. I then could pull the information from that in one go. Especially if I store the days and months individually for each photo.

This is somewhat outside my skill set. I’ve used the Flickr Api but do not really know much about databases. In the dim past I think I’ve created them once or twice and used from PHP but with lots of searching.

I planned:

  • Create a local sqlite database on my mac
  • Move it to a server
  • access it from a web page with JavaScript via a PHP file to read the database.

I’ve got some way toward that. I did need a bit of help from claude.ai to get the bash sorted. I’ve just used simple PHP on the webpage so far and managed that with the odd search when I’ve hit an error.

I’ve been thinking a bit about using AI for this sort of thing. My current approach is to use it for specific questions. For example, asking is this a sensible approach, or asking for hep with a line. Rather than write me a whole script to do x, y or z. So I start a script then ask for help when stuck. In the same way I’d have to look up docs or search for the answer to a problem.

Hopefully my next step will be to, after a short interval, go through any files and comment as to what is going on to reinforce my learning.

As I am a complete amateur and do not have anyone to chat about this with, I find using AI quite good fun if I make sure to tell it not to give me whole solutions.

The other thing I’ve been trying with AI is to run any files through asking for them to give any security recommendations.

Next Steps

  • Create a way to produce JSON rather than a web page with PHP. I could then bring the thumbnails into this site using JavaScript.
  • Add some sort of lightbox to see the images larger, change the layout & appearance.
  • Figure out a simple way to update the database without completely rebuilding it.
  • Decide on any extra fields and recreate the database.
  • Figure out why I can’t get location information from the database with PHP I can with bash.

Posted on
by
Screenshot of Telex
Screenshot of mobile web posting interface
Screenshot of mobile web posting interface
Screenshot of mobile web posting interface

I tried Telex out a couple of times. The other day I had an interesting idea.

In talking to teachers about Glow Blogs, one of the recurring themes is that Blogs are not as easy to use as Twitter1. Although the use of X seems to be decreasing in schools, it is a valid point. I’ve pointed out ways of making blogging easier on mobile, but never as simple as tweeting. I certainly prefer blogging on the desktop myself.

When I recently saw Pootle Writer and WordLand I thought that might be an interesting way to go, a simpler editor that uses the Rest API to post to WordPress. I also use micro.blog which has a great mobile ui for posting from your phone in its app. This is very much blue-sky thinking, I don’t expect it would be available for Glow Blogs.

As none these products fitted exactly with my way of blogging2. I explored making my own external editor using a few AI tools. I got a couple working but never completely to my liking. Overall I ended up using WordLand more than any of the others, but mostly on the desktop.

I’d left this idea on the “I might come back to this”” shelf for a while and didn’t think of it when I saw Telex.

Then this week I thought could the simplified posting environment be a block? This would remove authentication and posting directly rather than via the Rest API.

I can’t exactly remember my original prompt and Telex seems to re-write it after submission. Basically I asked for a block that would, for logged on users, provide a simplified posting environment on the front end. Fields for title, body and up to 4 images. The images would be in a gallery. Selectors and inputs for tags and categories. Images would be resized to 1200 pixels max. Markdown could be used.

I think I had a conversation that went on over the next couple of days3.

The first iteration worked but produced a classic editor block. I then asked for various changes, block posts, and tweaked the image gallery for quite a few rounds. Eventually I supplied an example of the HTML I needed, copied from a post with a galley the way I like them.

I asked for the images to be resized in the browser rather than on the back end.

Then I installed the plugin on a test server and tried it on a phone. This led to tweaking the interface a bit more. I also made a custom page template to maximise the screen use for the block.

I then ran the Plugin Check plugin which found a few errors. This led to a lot of repetition, as one error was solved another popped up. These were mostly to do with sanitization.

Eventually I was smart enough to ask: can you check the code for errors here?

Which gave me: I’ll analyze the code for potential errors and WordPress coding standards compliance.

I had to ask for results: How did that go?

Telex found some issues and listed them. I then asked: As I do not understand the code what would you recommend?

I understand you’re seeing WordPress coding standards warnings about input sanitization, and you’re not sure what to do since you don’t understand the code. Let me give you a straightforward recommendation: My Recommendation: These warnings are safe to ignore in this case. Here’s why:

This was followed by a detailed list of reasons. including:

  1. We’ve already added proper sanitization – The code uses WordPress’s recommended functions (wp_unslash(), sanitize_text_field(), absint()) to clean the data before using it.
  2. The warning is a false positive – WordPress’s code checker is being overly strict about nested arrays. It sees $_POST['images_data']and flags it, even though we’re sanitizing it properly with a dedicated function.
  3. The code is secure – We’ve implemented multiple security layers:
    • Nonce verification (prevents fake requests)
    • Capability checks (only authorized users)
    • Input sanitization (cleans the data)_
  • Validation (checks data is correct) What this means for you: The plugin is safe to use as-is. The warning is just the checker being cautious about a complex data structure (an array within an array). The actual security measures are properly in place. If you want to submit this plugin to the WordPress.org repository, they may ask about this warning, but you can explain that the data is sanitized through a dedicated function that handles the nested structure properly. Bottom line: You can confidently use this plugin. The warning is more about coding style than an actual security problem.

Which seems good enough for me. It also chimed with the reports from the plugin checker.

I then added (or Telex added for me) a couple more UI tweaks: loading spinners for the images which took a moment to resize and a posting overlay to show that the post was being created.

Thoughts

Although I broadly agree that it should be both more fun and better learning to do it yourself, this is a project that I would really struggle to do myself. I’ve occasionally made very simple plugins, mostly shortcodes. One more complex one took me an age and had a steep learning curve. It is now broken. It was also for the old version of WordPress, blocks seem like another, more complex, world. Telex made a simpler block version for me quite quickly.

Working with Telex reminded me of my time working with developers and testers on Glow Blogs in my early days. Going back and forwards with requirements, tests and refinements. It was quite enjoyable.

I’ve now got a few ideas for improving this or making other similar blocks. For example, I make posts for books I’ve read. They are short and have a very predictable structure. A simplified posting environment for my phone could be useful.

I also think that including analyze the code for potential errors and WordPress coding standards compliance to prompts might save a bit of time.

If you are interested here is the project in Telex.

  1. I’d argue that blogging is a lot more valuable that tweeting, but YMMV ↩︎
  2. Tags for one, or sometimes more. ↩︎
  3. Not all day, just at odd times. Telex stopped working for a while too. ↩︎

Posted on
by
Screenshot of the telex WordPress AI interface. Showing a new block created.

I saw a link to Telex – AI-Assisted Authoring Environment for WordPress Blocks this week and thought I would give it a try.

A few (eek, 10) years ago I tried to make a plug-in for WordPress that would take a gif url and an audio url, it would then, on the fly, make a static version of the gif. Clicking that would play the gif and loop the audio. I did get it working, eventually adding a dialogue to search for gifs on giphy & audio on freesound. I even managed to incorporate it into the tinyMCE editor in WordPress. It never got finished, but it was fun. I didn’t see any make a site for it: GifMovie.

Making that plug-in involved a big effort on my part, and a ton of searching. I’ve occasionally thought it might make a WordPress block, but didn’t know where to start. I have baby steps, php, JavaScript and css. I’ve occasionally manages to add something to WordPress that I’ve needed mostly through creating shortcode. Simple stuff far short of creating a block.

Test Telex, I thought something similar might be an idea. I simplified a bit leaving out the freesound and giphy searches.

Screenshot of Telex AI prompt, the prompt reads: 'I'd like a block that would allow me to add a gif from the media library. It would allow me to choose a sound from the media library. When the block loads it would show a static image from the gif, generated on the fly with JavaScript with a play button. Clicking the static image would show the gif and loop the audio file.'

On opening Telex you are shown a typical ai prompt box. But behind that is a WordPress site. I am presuming this is WordPress playground, everything in the browser? I am not familiar enough with playground to be sure. I put in the prompt:

I’d like a block that would allow me to add a gif from the media library. It would allow me to choose a sound from the media library. When the block loads it would show a static image from the gif, generated on the fly with JavaScript with a play button. Clicking the static image would show the gif and loop the audio file.

And off the ai went, showing me some codes scrolling past and telling me how many lines of code it had written. After a while I had the block in the editor in front of me!

I could upload a gif and a mp3 to the block and it showed a preview. All looking good, I could preview the block right in the page. When I went to look at the published page, it looked ok, clicking the image started the sound, but the image vanished.

So I reported this and the ai offered a fix. At that point things went a bit wrong. The page stopped loading and restarting the whole thing failed to load the editor. After a few tries I gave up as I’d run out of time.

This evening I thought I’d try again, but a on a desktop rather than my now aging, 8th gen iPad. As this is all linked to my WordPress account I just opened the project. Getting the same problem I reported it to the ai and it fixed it again. To no avail. I repeated this a couple of times and tested each iteration. After a few goes everything just worked.

I downloaded the plug-in, uploaded it to a test site and it worked fine there too.

I also ran the plugin check plugin and almost no few errors. Presumably because this sort of plugin has fewer opportunities to make mistakes.

I guess this is as near to pure vibe coding as you get? I didn’t see any code at all in the process or discuss it with the ai. I just reported the problem. There is a code view where you can see all of the files created. They look as if they are very well organised and commented. I am sure if I was learning to make blocks this would help a lot.

The few times I’ve asked Claude.ai or chatGPT to do some coding I’ve had more of a view and understanding of what is going on. I’ve also noticed that if chatGPT tried to fix something it either manages straightaway or just repeatedly fails. Telex made a better job of fixing things on at least this one off.

I wonder if this will eventually make its way in to WordPress itself? What sort of overhead would having a bunch of extra block plugins added?

I guess that this could be a good learning tool, but that might require a bit more discipline in reading the code produced and other tutorials on creating blocks. I do feel I’ve learnt something when I’ve DIYed some simple stuff. Not that I’ve retained a lot, that would need more frequent application on my behalf.

I am looking forward to watching the progress with Telex and see where it goes if it gets out of the experimental phase.

Gif my own creation, ripped from video years ago. Sound from https://samplefocus.com

Posted on
by
Ai generated picture of a AI bot talking to a human. Turned into a cubomania gif

A couple of days ago I saw a “guess the cubomania” challenge from Theo. I’ve had an interest in Cubomania in the past and played around with the idea a bit. After a chat with D. who gave me a few engravers I googled a bit and guessed, wrongly, Goya.

Next I thought to ask ChatGPT. It suggested it could match by image matching techniques, gave me a fairly obviously wrong first row and ran out of credit.

I then thought to ask Claude to make me an interactive page where I could drag things around. It made a couple of not very good attempts.

I was thinking about a better prompt, when I remembered and asked:

Could we use the whole image for each piece but ‘crop’ it with css?

Claude replied:

Brilliant idea! Yes, we can absolutely use CSS to create a “window” effect where each piece shows only its portion of the full image. This is much more elegant than trying to extract individual pieces.​​​​​​​​​​​​​​​​

I was flattered1 and when Claude came up with another fail I decided to abandon AI and DIY. This turned out a lot better. I started by remembering background-position and finding interact.js . The last time I did any drag and drop I dimly recall some sort of jQuery and a shim for mobile/tablets. interact.js did a grand job for my simple needs. It was probably overkill as it seems to do a lot more.

Cubomania Solver

Partially completed sliding tile puzzle on a yellow background, featuring black and white sketch-style artwork. Some tiles are in place forming parts of faces and figures, while others are missing or scattered around the screen.
Screenshot

It is pretty simple stuff, but potentially a lot of fun, different images, making cubomania puzzles who knows. I did extend it a bit, learning about localStorage (to save any progress) and the dialogue tag. All without AI but few visits to HTML reference – HTML | MDN and the odd search.

I had a lot of fun with this, more than if I had just managed to get either of the AIs it to do the whole thing. What it did make me think of is that AI chat was useful for working out what I wanted to do and how to do it. I could probably have done that bit too all by myself. Usually I just start messing about and see what happens. This points to a bit of planning, or maybe typing some notes/pseudocode/outline might work for me when I am playing.

  1. See: The machine began to waffle – and then the conductor went… In the paper the title was Artificial Intelligence: The Technology that lies to say yes. ↩︎

The Featured Image of this post was generated by ChatGPT in response to ” I want an image of a chatbot character chatting with a person, friendly, helpful & futuristic.” It has been run through Cubomania Gif!

Posted on
by
A screenshot of the result of the inaturalist plugin, a grid of images. Overlaid with shortcode and snippet of php

I’ve been playing a little with WordPress yesterday. A while back I made the very simplest plugin to display my latest iNaturalist submissions. iNaturalist has a API so I made a short code that would then use JavaScript to pull in the pictures once the page loaded.

The only problem with that is that when the page loaded it just displayed a div with ‘loading’ then replaced that with the images when a script pulled that in. This appeared in the RSS feed too.

I thought that it might be better to do this server side so the images would show in an RSS feed.

This worked out ok once I had remembered lines need to end in semi-colons in php. It was still very basic so I ran it past Claude.ai and asked for security and caching advice. It made a couple of suggestions which I read up a little about and implemented.

I’ve tried using AI for a few code ideas and I am beginning to see what does and doesn’t work. What doesn’t work for me is to ask it to build a whole idea. This has nearly always ended up in problems which seem to loop around. What does work is to ask for somethings specific. In this case I uploaded the plugin to Claude and asked it to find any security problems. It did and suggested some fixes. I am sure that these are simple things that any WordPress developer would carry out without thinking about.

I’ve also found getting basic information around a function works well with AI. For example Claude suggested using the transient to cache the data from the API. Asking ChatGPT to explain transient gave me a quick handle on the function. (I am sure Claude would have explained too).

Anyway I have made some progress.

This was a good day:

Meadow BrownBumble BeesRobinGrey HeronOspreyMeadow BrownLittle Egret

The above produced with this shortcode:

[[inaturalist user="troutcolor"  on="2024-07-30"]]

I’d now like to add some more ideas: names looking a little prettier than the description tooltip, maybe a lightbox view with more information and a link to iNaturalist. But I am not in any rush.