The MAG email signatures and the images they load, hosted here so they no longer depend on HubSpot Files.
Signature images are hotlinked, never embedded — every time anyone opens one of these emails, their client re-fetches the image from its URL. That is why the images live in a repo with stable, versioned URLs instead of in HubSpot.
Public, because nothing here is confidential: the pages and the headshots are what already goes out on every email MAG sends. This is the difference from SleepOver, which needed a second private repo for a workbook full of phone numbers.
Always through jsDelivr, always pinned to a tag:
https://cdn.jsdelivr.net/gh/magn3tic/mag-signatures@v1.0.0/images/icons/mail.png
A tag is immutable on jsDelivr: once a version has been served it is cached forever and will never change under a live signature. To ship new artwork, push it and cut a new tag, then update the signatures to that tag. Never re-point an existing tag.
@main also works and picks up pushes, but it is for previewing only — do not
put a @main URL into a signature that goes out to people.
MAG-signatures-master.xlsx who has a signature -- the sheet to work from
MAG-signatures-master.csv the same rows, plain text
pages/ one signature page per person, plus index.html
generator/ the build scripts, and the old SA and US generators
images/gifs/ the animated headshots the signatures load (us/, sa/)
images/icons/ shared chrome: globe, mail, smartphone
images/headshots/us/ US headshots
images/headshots/sa/ SA headshots
images/headshots/sa-2025/ the 2025 SA round
assets/gmail/ the Gmail install illustrations (generator/build-shots.py)
migration/url-map.json every old HubSpot URL and the file it became
Served by GitHub Pages off main:
https://magn3tic.github.io/mag-signatures/pages/index.html the master list
https://magn3tic.github.io/mag-signatures/pages/Gabriel_Arias.html one person
index.html is the page to send round: every signature grouped by region,
searchable, with one switch that flips every preview to dark and a copy button
on each card. Each person’s own page shows their signature on white and on
black, gives them two ways to take it away — copy it, or copy the link — and
walks them through installing it in Gmail, one illustration per step.
The pages are generated. Editing one by hand is overwritten on the next build:
python3 generator/extract.py # read the pages -> generator/people.json
python3 generator/build-person.py # rebuild every page
python3 generator/build-index.py # rebuild index.html
extract.py reads the signature markup back out of the pages themselves, so
the signatures survive a rebuild untouched — the design around them is the only
thing regenerated.
Every signature loads a GIF from images/gifs/: the photo holds for 2.6 s,
crossfades into the MAG logo, holds it for 1.8 s and fades back. Outlook for
Windows shows only the first frame, which is the photo.
pip install pillow
python3 generator/make-gifs.py # images/gifs/ + people.json point at them
python3 generator/build-person.py && python3 generator/build-index.py
make-gifs.py builds each GIF from the headshot in images/headshots/ and
records which one in images/gifs/sources.json, so it can rebuild them after the
signatures already point at the GIFs. The URLs use CDN in generator/theme.py
– move that to the new tag whenever you cut one.
A signature image that fails to load on a page is swapped for
images/gifs/mag-logo.gif before it can be copied.
assets/gmail/step-2.png to step-8.png are clean recreations of the Gmail
screens, not screenshots: same size, light theme, one MAG-orange spotlight on
the thing to click. They come from generator/gmail-shots.html and are rendered
with headless Chrome:
python3 generator/build-shots.py
If Gmail moves something, change the scene in gmail-shots.html and re-run.
The spotlight and its label are measured from the element named in data-for,
so they follow the layout on their own.
Add them to generator/people.json (copy a colleague’s entry: file, name,
role, email, phone and the same values inside sig). With no headshot
yet, set photo and the first <img src> to LOGO and they get the logo
until one arrives. Then run the three commands above and build-master.py.
MAG-signatures-master.xlsx lists everyone with their role, address, phone,
region, page and page URL. Set their Status to Remove in the Signatures
tab, save, and run:
python3 generator/remove.py # show what would go
python3 generator/remove.py --apply # delete the pages and rebuild
Their headshot stays in images/ on purpose. Emails they already sent still
hotlink it, and pulling the file breaks their signature in every one of them.
The sheet is generated, but a rebuild reads the Status column back first, so what you have typed is never lost. Editing any other column changes nothing on its own — the signature markup lives in the page.
The Notes column flags two pages under one address, or a phone row that
links to an empty tel:.
Two different jobs in one repo, and the difference matters. The images are
pinned by tag and must never change under a signature already sitting in
someone’s mail client. The pages are expected to change, and are served off
main. Pushing a page therefore does not touch what @v1.0.0 serves.
gabrielmagcr/Mag-Signatures is the old location. It is left exactly as it was, still loading from HubSpot, and nothing new is published there.
That repo kept two copies of the pages: 63 at the root and 56 stale ones under
signature-generator/signatures/. Only the root set came across — the stale
copy had a broken src="undefined" on Owen Korinek and was missing Mia
Pitino’s newer headshot.
# add the file under images/, then
git add images && git commit -m "new headshot for <name>"
git push
git tag v1.1.0 && git push origin v1.1.0 # a NEW tag, never move v1.0.0
# then update the signatures that use it to @v1.1.0
migration/url-map.json maps each old magneticcreative.com/hubfs/… URL to
the file that replaced it. Leave the HubSpot files live but unused during the
transition — deleting them breaks the images in every already-sent email, and
HubSpot has no redirect from a deleted file URL.