Couldn’t post to reddit due to karma requirements and rotating burner accounts.
I do web development. Not much experience with Shopify, but I imagine it has a similar content management system to something like Wordpress. Image assets are uploaded to the backend and the developer can select which ones to use. Looking at the source code on the page and the image filenames can tell us a couple things and here are my findings.
The images are a little bit interesting but not because they change. Even on the previous version of the homepage there are three different images for each book bundle to handle mobile, tablet, and desktop breakpoints. CSS is toggling between them depending on screen size. Nothing exciting there.
What I found curious was how the image sets were named. The newer images appear to follow a specific naming convention, e.g. 5_items_10.jpg, likely meaning number 10 of the 5_items image set. The designer of these images is sequentially iterating the filenames as they work, with some images being revisions of previous ones.
On the Volume 1 bundle where we see the title changing, the images with the new “Talk Is Cheap Money Buys Ice Cream” title follow the new pattern, but the image with the original title doesn’t.
https://teddy.com/cdn/shop/files/IMG.png - Original title
https://teddy.com/cdn/shop/files/5_items_10.jpg - New title
https://teddy.com/cdn/shop/files/5_items_12.jpg - New title
Looking at the page on the wayback machine, it does appear that IMG.png is the original bundle image and there are two other images for the large breakpoints (both with the original book title and similar filename to IMG.png)
As they already had images in place for Volume 1 at all three breakpoints they definitely updated those two images intentionally. It’s unclear why they wouldn’t also update the image at the mobile breakpoint.
Image sequence
Another interesting thing to look at is the sequence of images, and think of it as a history. We can look for both png and jpg since we see both being used:
5_items_1.jpg - Nothing
5_items_1.png - Nothing
5_items_2.jpg - Nothing
5_items_2.png - Alternate layout for Volume 1 bundle on mobile (with updated title)
5_items_3.jpg - Alternate layout for Volume 2 bundle on mobile
5_items_3.png - Mobile Volume 1 bundle (updated title)
5_items_4.jpg - Nothing
5_items_4.png - Alternate layout of Mobile Volume 2 bundle
5_items_5.jpg - Nothing
5_items_5.png - Tablet Volume 2 bundle (different order of books)
5_items_6.jpg - Nothing
5_items_6.png - Nothing
5_items_7.jpg - Nothing
5_items_7.png - Alternate layout of Volume 2 bundle
5_items_8.jpg - Nothing
5_items_8.png - Same as 5_items_3.png but the discount tag is rotated.
5_items_9.jpg - Nothing
5_items_9.png - Desktop Volume 2 bundle but with no shadow
5_items_9_1.jpg - Desktop Volume 2 bundle
5_items_10.jpg - Desktop Volume 1 bundle
5_items_10.png - Nothing
5_items_11.jpg - Tablet Volume 2 bundle
5_items_11.png - Nothing
5_items_12.jpg - Tablet Volume 1 bundle
5_items_12.png - Nothing
5_items_13.jpg - Nothing
5_items_13.png - Nothing
5_items_14.jpg - Mobile Volume 2 bundle
5_items_14.png - Nothing
5_items_15.jpg - Nothing
5_items_15.png - Nothing
5_items_16.jpg - Mobile Volume 1 & 2 bundle
5_items_16.png - Nothing
5_items_17.jpg - Tablet Volume 1 & 2 bundle
5_items_17.png - Nothing
5_items_18.jpg - Nothing
5_items_18.png - Nothing
…
10_items_1.jpg - Nothing
10_items_1.png - Alternative mobile layout of Volume 1 & 2 bundle (original titles)
10_items_2.jpg - Nothing
10_items_2.png - Desktop layout of Volume 1 & 2 bundle (original titles, no shadows, books are not all the same size)
10_items_3.jpg - Desktop Volume 1 & 2 bundle, correctly sized with shadows
10_items_3.png - Nothing
10_items_4.jpg - Nothing
10_items_4.png - Nothing
10items_4.jpg - Desktop Volume 1 & 2 bundle, no discount tag
10items_4.png - Nothing
What does this history say to me?
Let’s assume any gaps are rejected unused assets sitting in the CMS not publicly available.
PNGs consistently seem to be the option without a background shadow on the book covers.
The designer started with PNGs and no shadows, then around 5_items_9 they made a switch to JPG and shadows.
From the beginning of the set they are using the new “Ice Cream” title not the original title. Except when they get to the ten book bundle they’re back to using the original title… even though the 10 book bundle images seem to have been designed last.
A jpg version of 5_items_3.png with shadows is what we would expect to be used in place of IMG.png for the Volume 1 mobile breakpoint, but it doesn’t appear to exist, at least not publicly. It doesn’t make sense why they would update only two of the three images for Volume 1. Either update all three to follow some new design or new format, or save the effort and leave all three existing images in place since the bundle itself hasn’t changed.
Also interesting that the same filename (5_items_3) with different filetype extensions is used for two totally different layouts on separate bundles. This isn’t an accident and is the only instance we can see this happening.
We get a 5_items_9_1 which is the only obvious sub version number. This could indicate there was some client feedback here, probably “add shadows and make them jpgs” because from here on we only see the 5_items set as jpgs.
For the ten book bundle we see 5_items_16 on a mobile breakpoint, 5_items_17 on a tablet breakpoint, and then a switch in naming to 10_items_1 on desktop.
My initial impression for what might have happened here was the designer was working mobile first, copied the layout of the five book bundle, made their changes, saved the file but forgot to change the 5 to a 10. They do it again for the tablet version.
By the time they got to designing the alternative mobile layout they then made the change to the filename, but don’t go back and change the existing mistakes.This would make it harder to find the right image in the CMS since it’s not following the existing naming convention.
This would also indicate to me that these images were not delivered to the client as a set, but were a result of an iterative process.
Seeing the 10 item images with the wrong naming convention, the 10items_4.jpg filename with a missing underscore, and the 10_items_2.png with the books not sized correctly implies to me that this person doesn’t care/is not very detail oriented, is not a professional, is rushing the process, or it’s some combination of all of these.
With that in mind, it’s entirely possible the wrong book cover was used in the Volume 1 bundle. Maybe “TALK IS CHEAP MONEY BUYS ICE CREAM” was a rejected title.
But then, why touch the volume 1 assets at all? Why not use the original set for that bundle that’s already in the CMS?
It’s weird any way you look at it. Either:
a) There was an oversight, the book was meant to be renamed, and all the images should have been updated with the new title including on the details page for the bundle and for the individual book. Unlikely.
b) There was an oversight, and none of the images should have been updated with the new title. Maybe it was a rejected title pre-publishing, the person doing the layout pulled in an old image of the cover, and no one caught the mistake. Possible, since the designer doing these layouts maybe isn’t the most detail oriented (or if it’s RC himself, is super busy with, you know, WORK)
c) It’s an easter egg, and a nod to the community. But if it was an easter egg, why have a designer do multiple versions in multiple layouts, some with shadow and some without? It’s also not well hidden. Why not just update one of the three images? Maybe have it appear at a weird breakpoint for 1 pixel so you only see a flash of the title when changing the size of your window (or if you peek the source code). That’s how I would do it.
TL;DR
The image changing is because of responsive design serving the correct image for the browser, not because of any secret pattern of navigation. The designer created new images for the Volume 1 bundle rather than reusing the existing set, but whoever updated the site kept one of the three original images in place (the mobile one). It’s unclear why. The designer of the new images chose to use the “TALK IS CHEAP MONEY BUYS ICE CREAM” title for that Volume 1 bundle, but based on some of the other clues in the filenames and rejected assets it’s possible this person is sloppy or was rushed and made a mistake.
That being said, I don’t want to take away from the fact that the alternative title exists at all is quite interesting in and of itself.
Side note / bonus tinfoil
The banner image alt text says “Dad with sons and Teddy with a dog” but we all know that’s not Kingston and Princeton’s dad, it’s their grandpa Teddy.