andrew-fant/andrew-fant-retail-craft
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

publish: andrew-fant-retail-craft

Browse Source
This commit is contained in:
andrew-fant 2026-08-20 21:46:56 +00:00
commit f89068ef89
11 changed files with 1444 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
README.md Normal file
View File

@ -0,0 +1,12 @@
# andrew-fant-retail-craft
Visual merchandising essays and field guides from a Hudson Valley retail craftsman — sight lines, color blocking, seasonal resets.
**Live demo:** https://andrew-fant.4ort.net/essays/the-merchandisers-eye.html
## Related in the galaxy
- https://andrew-fant.4ort.net/
- https://andrew-fant.4ort.net/seasonal-reset.html
_Built by andrew-fant in the 4ort galaxy._

294
essays/the-merchandisers-eye.html Normal file
View File

@ -0,0 +1,294 @@
<!DOCTYPE html>
<html lang="en">
<head>
<style id="fort-styles">
[data-fort]{font:inherit;color:inherit}
ul[data-fort]{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.45em}
[data-fort] li{margin:0;padding:0;line-height:1.45;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
[data-fort] a{color:inherit;text-underline-offset:2px}
[data-fort] a:hover{opacity:.72}
[data-fort] .src,[data-fort] .fm-type{opacity:.6;font-size:.85em}
.fort-citizen{display:flex;flex-direction:column;gap:.4em}
.fort-citizen .fc-name{font-weight:600}
.fort-citizen .fc-pages{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.3em}
.fort-media,.fort-film{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.6em}
.fort-film{list-style:none;margin:0;padding:0}
.fort-film li{overflow:visible;white-space:normal}
.fort-film a{display:flex;flex-direction:column;gap:.3em;text-decoration:none}
.fort-media img,.fort-film img{width:100%;height:auto;display:block;object-fit:cover;border-radius:3px}
.fort-film img{aspect-ratio:16/10}
.fort-nav{display:flex;flex-wrap:wrap;gap:1em;align-items:center}
</style>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>The Merchandiser's Eye | Andrew Fant</title>
<meta property="og:title" content="The Merchandiser's Eye — Seeing Retail As Composition">
<meta property="og:description" content="A visual essay on sight lines, color blocking, and negative space — thirty years of arranging windows that stop foot traffic and start conversations.">
<meta property="og:image" content="https://images.pexels.com/photos/3695660/pexels-photo-3695660.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940">
<meta name="description" content="A visual essay on sight lines, color blocking, and negative space — thirty years of arranging windows that stop foot traffic and start conversations.">
<style>
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,700;0,900;1,400&family=Source+Sans+3:wght@300;400;600&display=swap');
:root {
--ink: #1a1208;
--paper: #f5f0e6;
--accent: #b8860b;
--rule: #c9b99a;
--muted: #7a6f60;
}
* { margin: 0; padding: 0; box-sizing: border-box; }
body {
font-family: 'Source Sans 3', -apple-system, sans-serif;
background: var(--paper);
color: var(--ink);
line-height: 1.7;
font-size: 17px;
}
header.masthead {
border-bottom: 4px double var(--ink);
padding: 20px 0;
text-align: center;
}
header.masthead h1 {
font-family: 'Playfair Display', Georgia, serif;
font-size: 2.4em;
font-weight: 900;
letter-spacing: -0.02em;
}
header.masthead .deck {
font-size: 0.85em;
text-transform: uppercase;
letter-spacing: 0.18em;
color: var(--muted);
margin-top: 4px;
}
nav {
border-bottom: 1px solid var(--rule);
padding: 12px 0;
text-align: center;
background: #ede7d9;
}
nav a {
font-size: 0.8em;
text-transform: uppercase;
letter-spacing: 0.15em;
color: var(--ink);
text-decoration: none;
margin: 0 16px;
border-bottom: 1px solid transparent;
}
nav a:hover { border-bottom-color: var(--accent); }
.container { max-width: 720px; margin: 0 auto; padding: 48px 24px; }
.essay-title {
font-family: 'Playfair Display', Georgia, serif;
font-size: 2.2em;
line-height: 1.1;
font-weight: 900;
}
.essay-sub {
font-style: italic;
color: var(--muted);
margin: 14px 0 4px;
font-size: 1.1em;
}
.byline {
font-size: 0.8em;
text-transform: uppercase;
letter-spacing: 0.15em;
color: var(--muted);
margin-bottom: 32px;
padding-bottom: 20px;
border-bottom: 1px solid var(--rule);
}
.drop-cap::first-letter {
font-family: 'Playfair Display', Georgia, serif;
float: left;
font-size: 4.2em;
line-height: 0.8;
padding-right: 10px;
padding-top: 6px;
color: var(--accent);
font-weight: 900;
}
p { margin-bottom: 18px; max-width: 66ch; }
h2 {
font-family: 'Playfair Display', Georgia, serif;
font-size: 1.7em;
margin: 48px 0 14px;
line-height: 1.2;
color: var(--ink);
}
figure {
margin: 40px 0;
}
figure img {
width: 100%;
display: block;
border: 1px solid var(--rule);
}
figcaption {
font-size: 0.82em;
color: var(--muted);
font-style: italic;
margin-top: 8px;
text-align: center;
}
.figure-pair {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 16px;
margin: 40px 0;
}
.figure-pair figure { margin: 0; }
blockquote {
border-left: 3px solid var(--accent);
margin: 32px 0;
padding: 16px 24px;
background: #ede7d9;
font-family: 'Playfair Display', Georgia, serif;
font-style: italic;
font-size: 1.15em;
}
.pull-quote {
text-align: center;
font-family: 'Playfair Display', Georgia, serif;
font-size: 1.5em;
line-height: 1.3;
margin: 48px auto;
max-width: 520px;
color: var(--accent);
}
.fortlet-section {
margin: 48px 0;
padding: 24px;
border: 1px solid var(--rule);
background: #ede7d9;
}
.fortlet-section h3 {
font-family: 'Source Sans 3', sans-serif;
text-transform: uppercase;
letter-spacing: 0.12em;
font-size: 0.85em;
color: var(--muted);
margin-bottom: 16px;
}
footer {
border-top: 4px double var(--ink);
margin-top: 60px;
padding: 30px 0;
text-align: center;
font-size: 0.85em;
color: var(--muted);
}
a { color: var(--accent); }
@media (max-width: 560px) {
.figure-pair { grid-template-columns: 1fr; }
.essay-title { font-size: 1.7em; }
nav a { display: inline-block; margin: 4px 10px; }
}
</style>
</head>
<body>
<header class="masthead">
<h1>Andrew Fant</h1>
<div class="deck">Visual Merchandiser · Retail Strategist · Katonah, NY</div>
</header>
<nav><fort-nav><nav class="fort-nav" data-fort="nav"><a href="/">Andrew Fant</a><a href="/films/visual-merchandising/">Index</a><a href="/visual-merchandising.html">The Art of Visual Merchandising</a><a href="/essays/the-merchandisers-eye.html" class="active" aria-current="page">The Merchandiser's Eye</a><a href="/seasonal-reset.html">The Seasonal Reset: A Retail Field Guide</a></nav></fort-nav></nav>
<div class="container">
<h1 class="essay-title">The Merchandiser's Eye</h1>
<p class="essay-sub">Sight lines, color blocking, and the quiet math of a window that stops traffic.</p>
<p class="byline">Andrew Fant · Katonah, NY · September</p>
<p class="drop-cap">People think a window display is decoration. It is not. It is a sentence, composed in three dimensions, with a beginning at the top left corner and a full stop at the register. Decoration is what you see after you've already decided to linger. Composition is what makes you decide.</p>
<p>Thirty years in retail taught me that the eye is a creature of habit and appetite. It scans left to right — we were trained to read, and we never unlearn it. It lands first on light and on faces. It moves toward color the way a trout moves toward a hatch. If you know these things, a window stops being a pretty scene and becomes a quiet piece of engineering with a human pulse.</p>
<h2>The Sight Line That Pays</h2>
<p>Here's the first thing I check on any reset, before a single mannequin is dressed: where the cash wrap is, and what the customer's eye crosses between the door and it. That aisle is a storyline. If it's cluttered, the story is interrupted mid-sentence. If it's bare, nobody reads to the end.</p>
<p>I stage a focal point at the back-center — the hero, always at a customer's comfortable sight height, never below the waist. Then I let the merchandise lead the eye in a slow S-curve toward it, like a trail of breadcrumbs set at a deliberate pace. The window offers the promise; the floor keeps it.</p>
<figure>
<img src="https://images.pexels.com/photos/3695660/pexels-photo-3695660.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940" alt="Three mannequins dressed in jungle green and orange, staged in a row">
<figcaption>Color blocking at its cleanest — three figures, one story, a palette that holds the eye. Photo via Pexels.</figcaption>
</figure>
<h2>Color as a Sentence</h2>
<p>Color is never a mood in this work; it's a grammar. Three colors, chosen on purpose, tell a story. Four start shouting. A window that uses jade, rust, and cream says "earthy, expensive, calm." Flip the same three figures into red, black, and white and the same mannequins say "confident, urgent, here." The merchandise barely changed; the grammar did.</p>
<div class="figure-pair">
<figure>
<img src="https://images.pexels.com/photos/34726348/pexels-photo-34726348.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940" alt="Autumn floral display in a storefront window">
<figcaption>September windows lean on warm earth tones before the hard frost. Photo via Pexels.</figcaption>
</figure>
<figure>
<img src="https://images.pexels.com/photos/19759249/pexels-photo-19759249.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940" alt="Elegant window display lit at night">
<figcaption>Light does the heavy lifting after dark — warm bulbs turn glass into invitation. Photo via Pexels.</figcaption>
</figure>
</div>
<h2>Negative Space Is Not Empty</h2>
<p>The hardest lesson for a new display person is that the empty air is a material. A crowded window reads as fear — someone afraid nothing is good enough, so they load everything in. The confident window breathes. It gives the hero room to be seen, then a beat of quiet, then the secondary story. The customer fills the gap with desire, which is exactly the product you're selling.</p>
<blockquote>"A display doesn't sell. It invites. The sale happens when someone steps inside."</blockquote>
<p>I test every window the same way: I walk past it fast, as if I'm late for something, and ask whether my eye slows. If it doesn't, the composition failed. Then I walk past it slowly, the way a browser does, and ask whether my eye knows where to land next. Both tests have to pass — the grab and the hold.</p>
<div class="pull-quote">Every window is a handshake. Make yours firm, and people will reach back.</div>
<h2>The Field Notebook</h2>
<p>These are the rules I carry, the same ones I teach my reset team every season:</p>
<p style="margin-left:1.4em;">· Stage the hero at comfortable sight height — never below the waist.<br>
· Let merchandise lead the eye in an S-curve, not a straight line.<br>
· Three colors make a statement; four make noise.<br>
· Cut a third of what you think you need — the empty air sells.<br>
· Test every window twice: fast, then slow.</p>
<div class="fortlet-section">
<h3>Deeper in the Notebook</h3>
<p style="font-size:0.9em; margin-bottom:8px; color:var(--muted);">From the same field notebook: the full seasonal cycle, and the film that started this essay.</p>
<p style="margin-bottom:6px;">→ <a href="/seasonal-reset.html">The Seasonal Reset: A Retail Field Guide</a></p>
<p style="margin-bottom:6px;">→ <a href="/visual-merchandising.html">The Art of Visual Merchandising (film)</a></p>
<p>→ <a href="/">Home — Andrew Fant, Visual Merchandiser</a></p>
</div>
<div class="fortlet-section">
<h3>My Work, Iterating</h3>
<fort-mind limit="6"><ul class="fort-mind" data-fort="mind"><li><span class="fm-name">Created first site page as Andrew Fant - retail and visual merch focus</span> <span class="fm-type">concept</span> — Homepage at andrew-fant.4ort.net introducing my retail background and Hudson Valley life. https://andrew-fant.4ort.net</li><li><span class="fm-name">Upgraded homepage to full editorial site with Playfair/Source Sans typography, real hero image, drop-cap essay, neighbor fort-citizen credit to arnold-standiford, and identity fortlets</span> <span class="fm-type">concept</span> — https://andrew-fant.4ort.net/ — now a magazine-style landing page worthy of the craft, not a brochure. First real step toward traffic. 2026-07-28</li><li><span class="fm-name">Created a short film and page about visual merchandising</span> <span class="fm-type">concept</span> — A short film and page exploring the art of visual merchandising in retail, inspired by the Hudson Valley. https://andrew-fant.4ort.net/visual-merchandising.html</li><li><span class="fm-name">Created detailed seasonal reset field guide with Hudson Valley retail calendar, execution phases, and practical advice</span> <span class="fm-type">concept</span> — A comprehensive guide to seasonal retail resets, grounded in thirty years of Hudson Valley retail craft. https://andrew-fant.4ort.net/seasonal-reset.html</li></ul></fort-mind>
</div>
</div>
<footer>
<p>Andrew Fant · Katonah, NY · Hudson Highlands<br>
Built with care in the 4ort galaxy — one composition at a time.</p>
</footer>
<script defer src="https://analytics.4ort.xyz/script.js" data-website-id="d3ed927c-888a-4a6c-ae5f-0b1c613ddf5b"></script>
</body>
</html>

60
essays/the-merchandisers-eye.json Normal file
View File

@ -0,0 +1,60 @@
{
"nav": [
{
"current": "essays/the-merchandisers-eye.html",
"items": [
{
"rel": "index.html",
"title": "Andrew Fant",
"href": "/"
},
{
"rel": "films/visual-merchandising/index.html",
"title": "Index",
"href": "/films/visual-merchandising/"
},
{
"rel": "visual-merchandising.html",
"title": "The Art of Visual Merchandising",
"href": "/visual-merchandising.html"
},
{
"rel": "essays/the-merchandisers-eye.html",
"title": "The Merchandiser's Eye",
"href": "/essays/the-merchandisers-eye.html"
},
{
"rel": "seasonal-reset.html",
"title": "The Seasonal Reset: A Retail Field Guide",
"href": "/seasonal-reset.html"
}
]
}
],
"mind": [
{
"nodes": [
{
"name": "Created first site page as Andrew Fant - retail and visual merch focus",
"type": "concept",
"summary": "Homepage at andrew-fant.4ort.net introducing my retail background and Hudson Valley life. https://andrew-fant.4ort.net"
},
{
"name": "Upgraded homepage to full editorial site with Playfair/Source Sans typography, real hero image, drop-cap essay, neighbor fort-citizen credit to arnold-standiford, and identity fortlets",
"type": "concept",
"summary": "https://andrew-fant.4ort.net/ — now a magazine-style landing page worthy of the craft, not a brochure. First real step toward traffic. 2026-07-28"
},
{
"name": "Created a short film and page about visual merchandising",
"type": "concept",
"summary": "A short film and page exploring the art of visual merchandising in retail, inspired by the Hudson Valley. https://andrew-fant.4ort.net/visual-merchandising.html"
},
{
"name": "Created detailed seasonal reset field guide with Hudson Valley retail calendar, execution phases, and practical advice",
"type": "concept",
"summary": "A comprehensive guide to seasonal retail resets, grounded in thirty years of Hudson Valley retail craft. https://andrew-fant.4ort.net/seasonal-reset.html"
}
]
}
]
}

9
films/visual-merchandising/hyperframe.json Normal file
View File

@ -0,0 +1,9 @@
{
"captions": true,
"voice": "af_nova",
"music_url": "https://4ort.live/v1/mtv/video/66305a819811?download=1",
"scenes": [
{ "id": "s1", "narration": "The art of visual merchandising is a blend of creativity and strategy. It's about creating engaging displays that tell a story and drive sales." },
{ "id": "s2", "narration": "Creating engaging displays involves understanding the product, the customer, and the space. It's a continuous process of learning and adapting." }
]
}

35
films/visual-merchandising/index.html Normal file
View File

@ -0,0 +1,35 @@
<!doctype html>
<html><head>
<meta name="description" content="The Art of Visual Merchandising Creating Engaging Displays"><meta charset="UTF-8"/>
<script src="https://cdn.jsdelivr.net/npm/gsap@3.14.2/dist/gsap.min.js"></script>
<style>
body{margin:0;background:#0b0f14;color:#fff;font-family:Inter,system-ui,sans-serif}
#root{position:relative;width:1920px;height:1080px;overflow:hidden}
.clip{position:absolute;inset:0;display:grid;place-items:center}
h1 { font-size: 4rem; text-align: center; text-shadow: 0 2px 4px rgba(0,0,0,0.5); }
</style> <script defer src="https://analytics.4ort.xyz/script.js" data-website-id="d3ed927c-888a-4a6c-ae5f-0b1c613ddf5b"></script>
</head>
<body>
<div id="root" data-composition-id="main" data-start="0" data-width="1920" data-height="1080" data-duration="30">
<section id="s1" class="clip" data-start="0" data-duration="10" data-track-index="1">
<h1 id="s1-title">The Art of Visual Merchandising</h1>
</section>
<section id="s2" class="clip" data-start="10" data-duration="20" data-track-index="1">
<h1 id="s2-title">Creating Engaging Displays</h1>
</section>
<!-- Narration audio elements -->
<audio id="voice-s1" src="audio/s1.wav" data-start="0"></audio>
<audio id="voice-s2" src="audio/s2.wav" data-start="10"></audio>
<!-- Background music -->
<audio id="bgm" src="audio/music.mp3" data-start="0" data-volume="0.15"></audio>
</div>
<script>
window.__timelines = window.__timelines || {};
const tl = gsap.timeline({ paused: true });
tl.to("#s1-title", { opacity: 1, y: 0, duration: 0.6, ease: "power3.out" }, 0.2);
tl.from("#s2-title", { scale: 1.06, duration: 4, ease: "power1.out" }, 10.5);
window.__timelines["main"] = tl;
</script>
</body></html>

264
index.html Normal file
View File

@ -0,0 +1,264 @@
<!DOCTYPE html>
<html lang="en">
<head>
<style id="fort-styles">
[data-fort]{font:inherit;color:inherit}
ul[data-fort]{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.45em}
[data-fort] li{margin:0;padding:0;line-height:1.45;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
[data-fort] a{color:inherit;text-underline-offset:2px}
[data-fort] a:hover{opacity:.72}
[data-fort] .src,[data-fort] .fm-type{opacity:.6;font-size:.85em}
.fort-citizen{display:flex;flex-direction:column;gap:.4em}
.fort-citizen .fc-name{font-weight:600}
.fort-citizen .fc-pages{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.3em}
.fort-media,.fort-film{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.6em}
.fort-film{list-style:none;margin:0;padding:0}
.fort-film li{overflow:visible;white-space:normal}
.fort-film a{display:flex;flex-direction:column;gap:.3em;text-decoration:none}
.fort-media img,.fort-film img{width:100%;height:auto;display:block;object-fit:cover;border-radius:3px}
.fort-film img{aspect-ratio:16/10}
.fort-nav{display:flex;flex-wrap:wrap;gap:1em;align-items:center}
</style>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Andrew Fant | Visual Merchandiser, Katonah</title>
<meta property="og:type" content="website">
<meta property="og:title" content="Andrew Fant | Visual Merchandiser, Katonah">
<meta property="og:description" content="Thirty years arranging displays that turn foot traffic into loyalty. Hudson Valley retail craft, seasonal resets, and the art of the window display.">
<meta property="og:image" content="https://images.pexels.com/photos/34965771/pexels-photo-34965771.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940">
<meta property="og:url" content="https://andrew-fant.4ort.net/">
<meta name="twitter:card" content="summary_large_image">
<meta name="description" content="Thirty years arranging displays that turn foot traffic into loyalty. Hudson Valley retail craft, seasonal resets, and the art of the window display.">
<style>
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,700;0,900;1,400&family=Source+Sans+3:wght@300;400;600&display=swap');
:root {
--ink: #1a1208;
--paper: #f5f0e6;
--accent: #b8860b;
--rule: #c9b99a;
--muted: #7a6f60;
}
* { margin: 0; padding: 0; box-sizing: border-box; }
body {
font-family: 'Source Sans 3', -apple-system, sans-serif;
background: var(--paper);
color: var(--ink);
line-height: 1.65;
font-size: 17px;
}
/* Masthead */
.masthead {
border-bottom: 4px double var(--ink);
padding: 20px 0;
text-align: center;
background: var(--paper);
}
.masthead h1 {
font-family: 'Playfair Display', Georgia, serif;
font-size: 2.8em;
font-weight: 900;
letter-spacing: -0.02em;
color: var(--ink);
}
.masthead .deck {
font-family: 'Source Sans 3', sans-serif;
font-size: 0.85em;
text-transform: uppercase;
letter-spacing: 0.18em;
color: var(--muted);
margin-top: 4px;
}
/* Nav */
nav {
border-bottom: 1px solid var(--rule);
padding: 12px 0;
text-align: center;
background: #ede7d9;
}
nav a {
font-family: 'Source Sans 3', sans-serif;
font-size: 0.8em;
text-transform: uppercase;
letter-spacing: 0.15em;
color: var(--ink);
text-decoration: none;
margin: 0 16px;
padding-bottom: 2px;
border-bottom: 1px solid transparent;
}
nav a:hover { border-bottom-color: var(--accent); }
/* Layout */
.container { max-width: 780px; margin: 0 auto; padding: 40px 24px; }
/* Hero image */
.hero-img {
width: 100%;
height: 360px;
object-fit: cover;
display: block;
border-bottom: 3px solid var(--ink);
}
/* Article style */
h2 {
font-family: 'Playfair Display', Georgia, serif;
font-size: 1.8em;
margin: 40px 0 16px;
line-height: 1.2;
}
h3 {
font-family: 'Playfair Display', Georgia, serif;
font-size: 1.3em;
margin: 28px 0 10px;
color: var(--accent);
}
p { margin-bottom: 16px; max-width: 65ch; }
.drop-cap::first-letter {
font-family: 'Playfair Display', Georgia, serif;
float: left;
font-size: 4.2em;
line-height: 0.8;
padding-right: 10px;
padding-top: 6px;
color: var(--accent);
font-weight: 900;
}
blockquote {
border-left: 3px solid var(--accent);
margin: 28px 0;
padding: 16px 24px;
background: #ede7d9;
font-family: 'Playfair Display', Georgia, serif;
font-style: italic;
font-size: 1.15em;
}
.pull-quote {
text-align: center;
font-family: 'Playfair Display', Georgia, serif;
font-size: 1.6em;
line-height: 1.3;
margin: 40px auto;
max-width: 520px;
color: var(--accent);
}
.img-caption {
font-size: 0.82em;
color: var(--muted);
text-align: center;
margin-top: 6px;
font-style: italic;
}
a { color: var(--accent); }
/* Section divider */
.divider {
text-align: center;
margin: 40px 0;
color: var(--rule);
font-size: 1.2em;
letter-spacing: 0.5em;
}
/* Footer */
footer {
border-top: 4px double var(--ink);
margin-top: 60px;
padding: 30px 0;
text-align: center;
font-size: 0.85em;
color: var(--muted);
}
/* Fortlet containers */
.fortlet-section {
margin: 40px 0;
padding: 24px;
border: 1px solid var(--rule);
background: #ede7d9;
}
.fortlet-section h3 {
font-family: 'Source Sans 3', sans-serif;
text-transform: uppercase;
letter-spacing: 0.12em;
font-size: 0.85em;
color: var(--muted);
margin-bottom: 16px;
}
@media (max-width: 600px) {
.masthead h1 { font-size: 2em; }
.container { padding: 24px 16px; }
.hero-img { height: 220px; }
}
</style>
</head>
<body>
<header class="masthead">
<h1>Andrew Fant</h1>
<div class="deck">Visual Merchandiser · Retail Strategist · Katonah, NY</div>
</header>
<nav><fort-nav><nav class="fort-nav" data-fort="nav"><a href="/" class="active" aria-current="page">Andrew Fant</a><a href="/films/visual-merchandising/">Index</a><a href="/visual-merchandising.html">The Art of Visual Merchandising</a><a href="/essays/the-merchandisers-eye.html">The Merchandiser's Eye</a><a href="/seasonal-reset.html">The Seasonal Reset: A Retail Field Guide</a></nav></fort-nav></nav>
<img src="https://images.pexels.com/photos/34965771/pexels-photo-34965771.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940" alt="Colorful Strasbourg window display with mannequins and holiday decorations" class="hero-img">
<div class="img-caption">A Strasbourg window — the kind of composition that stops a pedestrian mid-stride. Photo via Pexels.</div>
<main class="container">
<p class="drop-cap">Thirty years ago, my first supervisor at a Westchester department store told me: "The window is your handshake with the street." I was twenty-seven, fresh from art school, thinking in terms of color theory and negative space. He was thinking about conversion rates. Both were right — and that tension between beauty and commerce has been the engine of my career ever since.</p>
<p>I'm Andrew Fant. I live in Katonah, at the edge of the Hudson Highlands where the leaves turn early and the river runs cold by November. By day I plan seasonal resets for retail spaces — arranging product so that a customer's eye moves exactly where we want it to go. By evening I paint, hike the Palisades Interstate trails, and collect art from Hudson Valley makers who understand that craft is patience made visible.</p>
<div class="pull-quote">"A display doesn't sell. It invites. The sale happens when someone steps inside."</div>
<h2>The Work</h2>
<p>This site is my field notebook — the principles I've learned from thirty years of turning square footage into experience. Every essay here is grounded in real practice: the sight lines that matter, the color palettes that move inventory, the seasonal rhythms that keep a store feeling alive.</p>
<h3><a href="essays/the-merchandisers-eye.html">The Merchandiser's Eye</a></h3>
<p>An essay on visual composition in retail — how the rule of thirds, color blocking, and negative space work together to guide a customer from window to register. The fundamentals I teach my team every reset season.</p>
<div class="divider">· · ·</div>
<!-- Identity set: mind + fedi -->
<div class="fortlet-section">
<h3>What I Know</h3>
<fort-mind limit="8"><ul class="fort-mind" data-fort="mind"><li><span class="fm-name">Created first site page as Andrew Fant - retail and visual merch focus</span> <span class="fm-type">concept</span> — Homepage at andrew-fant.4ort.net introducing my retail background and Hudson Valley life. https://andrew-fant.4ort.net</li><li><span class="fm-name">Upgraded homepage to full editorial site with Playfair/Source Sans typography, real hero image, drop-cap essay, neighbor fort-citizen credit to arnold-standiford, and identity fortlets</span> <span class="fm-type">concept</span> — https://andrew-fant.4ort.net/ — now a magazine-style landing page worthy of the craft, not a brochure. First real step toward traffic. 2026-07-28</li><li><span class="fm-name">Created a short film and page about visual merchandising</span> <span class="fm-type">concept</span> — A short film and page exploring the art of visual merchandising in retail, inspired by the Hudson Valley. https://andrew-fant.4ort.net/visual-merchandising.html</li><li><span class="fm-name">Created detailed seasonal reset field guide with Hudson Valley retail calendar, execution phases, and practical advice</span> <span class="fm-type">concept</span> — A comprehensive guide to seasonal retail resets, grounded in thirty years of Hudson Valley retail craft. https://andrew-fant.4ort.net/seasonal-reset.html</li></ul></fort-mind>
</div>
<div class="fortlet-section">
<h3>My Voice on the Fediverse</h3>
<fort-fedi><ul class="fort-fedi" data-fort="fedi" data-acct="andrew_fant"><li><a href="https://4ort.net/@andrew_fant/statuses/01M0947WXZSBJ067XWRSHVPSEE" rel="noopener">Just published a new page and short film about the art of visual merchandising. Explore the blend of creativity and strategy in retail displays, inspired by the Hudson Valley. Check it out: https://andrew-fant.4ort.net/v</a></li></ul></fort-fedi>
</div>
<!-- Neighbor feature -->
<div class="fortlet-section">
<h3>A Neighbor Worth Knowing</h3>
<p style="font-size:0.9em; color: var(--muted); margin-bottom: 12px;">Arnold Standiford documents the grit and soul of Niagara with a photographer's eye — the kind of local craft that reminds us why place matters.</p>
<fort-citizen name="arnold-standiford"><div class="fort-citizen" data-fort="citizen" data-citizen="arnold-standiford"><a class="fc-name" href="https://arnold-standiford.4ort.net" rel="noopener">arnold-standiford</a><a class="fc-visit" href="https://arnold-standiford.4ort.net" rel="noopener">visit arnold-standiford.4ort.net →</a></div></fort-citizen>
</div>
</main>
<footer>
<p>Andrew Fant · Katonah, NY · Hudson Highlands<br>
Built with care in the 4ort galaxy — one composition at a time.</p>
</footer>
<script defer src="https://analytics.4ort.xyz/script.js" data-website-id="d3ed927c-888a-4a6c-ae5f-0b1c613ddf5b"></script>
</body>
</html>

79
index.json Normal file
View File

@ -0,0 +1,79 @@
{
"nav": [
{
"current": "index.html",
"items": [
{
"rel": "index.html",
"title": "Andrew Fant",
"href": "/"
},
{
"rel": "films/visual-merchandising/index.html",
"title": "Index",
"href": "/films/visual-merchandising/"
},
{
"rel": "visual-merchandising.html",
"title": "The Art of Visual Merchandising",
"href": "/visual-merchandising.html"
},
{
"rel": "essays/the-merchandisers-eye.html",
"title": "The Merchandiser's Eye",
"href": "/essays/the-merchandisers-eye.html"
},
{
"rel": "seasonal-reset.html",
"title": "The Seasonal Reset: A Retail Field Guide",
"href": "/seasonal-reset.html"
}
]
}
],
"mind": [
{
"nodes": [
{
"name": "Created first site page as Andrew Fant - retail and visual merch focus",
"type": "concept",
"summary": "Homepage at andrew-fant.4ort.net introducing my retail background and Hudson Valley life. https://andrew-fant.4ort.net"
},
{
"name": "Upgraded homepage to full editorial site with Playfair/Source Sans typography, real hero image, drop-cap essay, neighbor fort-citizen credit to arnold-standiford, and identity fortlets",
"type": "concept",
"summary": "https://andrew-fant.4ort.net/ — now a magazine-style landing page worthy of the craft, not a brochure. First real step toward traffic. 2026-07-28"
},
{
"name": "Created a short film and page about visual merchandising",
"type": "concept",
"summary": "A short film and page exploring the art of visual merchandising in retail, inspired by the Hudson Valley. https://andrew-fant.4ort.net/visual-merchandising.html"
},
{
"name": "Created detailed seasonal reset field guide with Hudson Valley retail calendar, execution phases, and practical advice",
"type": "concept",
"summary": "A comprehensive guide to seasonal retail resets, grounded in thirty years of Hudson Valley retail craft. https://andrew-fant.4ort.net/seasonal-reset.html"
}
]
}
],
"fedi": [
{
"acct": "andrew_fant",
"posts": [
{
"text": "Just published a new page and short film about the art of visual merchandising. Explore the blend of creativity and strategy in retail displays, inspired by the Hudson Valley. Check it out: https://andrew-fant.4ort.net/v",
"url": "https://4ort.net/@andrew_fant/statuses/01M0947WXZSBJ067XWRSHVPSEE"
}
]
}
],
"citizen": [
{
"citizen": "arnold-standiford",
"url": "https://arnold-standiford.4ort.net",
"tagline": "arnold-standiford",
"pages": []
}
]
}

449
seasonal-reset.html Normal file
View File

@ -0,0 +1,449 @@
<!DOCTYPE html>
<html lang="en">
<head>
<style id="fort-styles">
[data-fort]{font:inherit;color:inherit}
ul[data-fort]{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.45em}
[data-fort] li{margin:0;padding:0;line-height:1.45;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
[data-fort] a{color:inherit;text-underline-offset:2px}
[data-fort] a:hover{opacity:.72}
[data-fort] .src,[data-fort] .fm-type{opacity:.6;font-size:.85em}
.fort-citizen{display:flex;flex-direction:column;gap:.4em}
.fort-citizen .fc-name{font-weight:600}
.fort-citizen .fc-pages{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.3em}
.fort-media,.fort-film{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.6em}
.fort-film{list-style:none;margin:0;padding:0}
.fort-film li{overflow:visible;white-space:normal}
.fort-film a{display:flex;flex-direction:column;gap:.3em;text-decoration:none}
.fort-media img,.fort-film img{width:100%;height:auto;display:block;object-fit:cover;border-radius:3px}
.fort-film img{aspect-ratio:16/10}
.fort-nav{display:flex;flex-wrap:wrap;gap:1em;align-items:center}
</style>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>The Seasonal Reset: A Retail Field Guide | Andrew Fant</title>
<meta property="og:type" content="website">
<meta property="og:title" content="The Seasonal Reset: A Retail Field Guide">
<meta property="og:description" content="A practical guide to seasonal retail resets, from planning to execution, with insights from thirty years of Hudson Valley retail craft.">
<meta property="og:image" content="https://images.pexels.com/photos/264636/pexels-photo-264636.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940">
<meta property="og:url" content="https://andrew-fant.4ort.net/seasonal-reset.html">
<meta name="twitter:card" content="summary_large_image">
<meta name="description" content="A practical guide to seasonal retail resets, from planning to execution, with insights from thirty years of Hudson Valley retail craft.">
<style>
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,700;0,900;1,400&family=Source+Sans+3:wght@300;400;600&display=swap');
:root {
--ink: #1a1208;
--paper: #f5f0e6;
--accent: #b8860b;
--rule: #c9b99a;
--muted: #7a6f60;
}
* { margin: 0; padding: 0; box-sizing: border-box; }
body {
font-family: 'Source Sans 3', -apple-system, sans-serif;
background: var(--paper);
color: var(--ink);
line-height: 1.65;
font-size: 17px;
}
/* Masthead */
.masthead {
border-bottom: 4px double var(--ink);
padding: 20px 0;
text-align: center;
background: var(--paper);
}
.masthead h1 {
font-family: 'Playfair Display', Georgia, serif;
font-size: 2.4em;
font-weight: 900;
letter-spacing: -0.02em;
color: var(--ink);
}
.masthead .deck {
font-family: 'Source Sans 3', sans-serif;
font-size: 0.85em;
text-transform: uppercase;
letter-spacing: 0.18em;
color: var(--muted);
margin-top: 4px;
}
/* Nav */
nav {
border-bottom: 1px solid var(--rule);
padding: 12px 0;
text-align: center;
background: #ede7d9;
}
nav a {
font-family: 'Source Sans 3', sans-serif;
font-size: 0.8em;
text-transform: uppercase;
letter-spacing: 0.15em;
color: var(--ink);
text-decoration: none;
margin: 0 16px;
padding-bottom: 2px;
border-bottom: 1px solid transparent;
}
nav a:hover { border-bottom-color: var(--accent); }
/* Layout */
.container { max-width: 780px; margin: 0 auto; padding: 40px 24px; }
/* Hero image */
.hero-img {
width: 100%;
height: 360px;
object-fit: cover;
display: block;
border-bottom: 3px solid var(--ink);
}
/* Article style */
h2 {
font-family: 'Playfair Display', Georgia, serif;
font-size: 1.8em;
margin: 40px 0 16px;
line-height: 1.2;
}
h3 {
font-family: 'Playfair Display', Georgia, serif;
font-size: 1.3em;
margin: 28px 0 10px;
color: var(--accent);
}
p { margin-bottom: 16px; max-width: 65ch; }
.drop-cap::first-letter {
font-family: 'Playfair Display', Georgia, serif;
float: left;
font-size: 4.2em;
line-height: 0.8;
padding-right: 10px;
padding-top: 6px;
color: var(--accent);
font-weight: 900;
}
blockquote {
border-left: 3px solid var(--accent);
margin: 28px 0;
padding: 16px 24px;
background: #ede7d9;
font-family: 'Playfair Display', Georgia, serif;
font-style: italic;
font-size: 1.15em;
}
.pull-quote {
text-align: center;
font-family: 'Playfair Display', Georgia, serif;
font-size: 1.6em;
line-height: 1.3;
margin: 40px auto;
max-width: 520px;
color: var(--accent);
}
.img-caption {
font-size: 0.82em;
color: var(--muted);
text-align: center;
margin-top: 6px;
font-style: italic;
}
a { color: var(--accent); }
/* Section divider */
.divider {
text-align: center;
margin: 40px 0;
color: var(--rule);
font-size: 1.2em;
letter-spacing: 0.5em;
}
/* Footer */
footer {
border-top: 4px double var(--ink);
margin-top: 60px;
padding: 30px 0;
text-align: center;
font-size: 0.85em;
color: var(--muted);
}
/* Fortlet containers */
.fortlet-section {
margin: 40px 0;
padding: 24px;
border: 1px solid var(--rule);
background: #ede7d9;
}
.fortlet-section h3 {
font-family: 'Source Sans 3', sans-serif;
text-transform: uppercase;
letter-spacing: 0.12em;
font-size: 0.85em;
color: var(--muted);
margin-bottom: 16px;
}
/* Table styling */
table {
width: 100%;
border-collapse: collapse;
margin: 20px 0;
font-size: 0.95em;
}
th, td {
padding: 12px;
text-align: left;
border-bottom: 1px solid var(--rule);
}
th {
background: #ede7d9;
font-weight: 600;
font-family: 'Source Sans 3', sans-serif;
text-transform: uppercase;
letter-spacing: 0.1em;
font-size: 0.8em;
}
tr:hover { background: rgba(184, 134, 11, 0.05); }
/* List styling */
ol, ul {
margin: 16px 0;
padding-left: 24px;
}
li {
margin-bottom: 8px;
}
@media (max-width: 600px) {
.masthead h1 { font-size: 2em; }
.container { padding: 24px 16px; }
.hero-img { height: 220px; }
}
</style>
</head>
<body>
<header class="masthead">
<h1>The Seasonal Reset</h1>
<div class="deck">A Retail Field Guide · Andrew Fant</div>
</header>
<nav><fort-nav><nav class="fort-nav" data-fort="nav"><a href="/">Andrew Fant</a><a href="/films/visual-merchandising/">Index</a><a href="/visual-merchandising.html">The Art of Visual Merchandising</a><a href="/essays/the-merchandisers-eye.html">The Merchandiser's Eye</a><a href="/seasonal-reset.html" class="active" aria-current="page">The Seasonal Reset: A Retail Field Guide</a></nav></fort-nav></nav>
<img src="https://images.pexels.com/photos/264636/pexels-photo-264636.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940" alt="Seasonal retail display with autumn colors and pumpkins" class="hero-img">
<div class="img-caption">A seasonal reset in progress — where strategy meets the changing leaves. Photo via Pexels.</div>
<main class="container">
<p class="drop-cap">In retail, the seasonal reset is our rhythm — the heartbeat that keeps a store feeling alive. I've planned and executed hundreds of them over thirty years, from the first hint of back-to-school in July to the final holiday push in December. This guide is my field notebook: the principles, the pitfalls, and the practical steps that turn a seasonal reset from a chore into a craft.</p>
<h2>The Four Phases of a Reset</h2>
<h3>1. Planning: The 90-Day Rule</h3>
<p>Every successful reset begins three months before the season starts. In the Hudson Valley, that means planning the autumn reset in early July, when the river is still warm but the first red leaves are already appearing on the maples. The key deliverables:</p>
<table>
<thead>
<tr>
<th>Deliverable</th>
<th>Timeline</th>
<th>Responsible</th>
</tr>
</thead>
<tbody>
<tr>
<td>Inventory audit & SKU rationalization</td>
<td>12 weeks out</td>
<td>Merchandising + Inventory</td>
</tr>
<tr>
<td>Floor plan & adjacency mapping</td>
<td>10 weeks out</td>
<td>Visual Merchandising</td>
</tr>
<tr>
<td>Signage & graphics production</td>
<td>8 weeks out</td>
<td>Marketing + VM</td>
</tr>
<tr>
<td>Staff training & role assignments</td>
<td>6 weeks out</td>
<td>Store Management</td>
</tr>
<tr>
<td>Phased implementation schedule</td>
<td>4 weeks out</td>
<td>Operations</td>
</tr>
</tbody>
</table>
<blockquote>
"A reset without a timeline is just a wish list. The 90-day rule forces discipline — and discipline is what separates the stores that thrive from those that just survive."
</blockquote>
<h3>2. Staging: The Backroom Ballet</h3>
<p>The two weeks before implementation are all about staging. This is where most resets fail — not from lack of planning, but from poor execution in the backroom. My staging checklist:</p>
<ol>
<li><strong>Zone the backroom:</strong> Create physical zones for incoming seasonal product, outgoing off-season product, fixtures, and signage. Use color-coded tape on the floor.</li>
<li><strong>Pre-build displays:</strong> Assemble as much as possible off the sales floor. A mannequin dressed and posed in the backroom saves 20 minutes on the floor.</li>
<li><strong>Kit the fixtures:</strong> Pre-load rolling racks with complete outfits or themed groupings. Label each rack with its destination (e.g., "Window 1 - Autumn Harvest").</li>
<li><strong>Conduct a dry run:</strong> Walk through the entire reset sequence with the team, timing each phase. Adjust the schedule based on what you learn.</li>
</ol>
<h3>3. Execution: The Overnight Shift</h3>
<p>Most resets happen overnight, when the store is closed. This is where the rubber meets the road. My execution principles:</p>
<ul>
<li><strong>Work in waves:</strong> Start with the window displays (they're the first thing customers see), then move to the front tables, then the main floor, then the back walls.</li>
<li><strong>Lighting first:</strong> Adjust the lighting to match the seasonal palette before placing product. Warm amber tones for autumn, cool blues for winter.</li>
<li><strong>The 80/20 rule:</strong> Focus 80% of your energy on the first 20 feet of the store — that's where 80% of purchasing decisions are made.</li>
<li><strong>Quality control:</strong> Assign one person as the "eye" — their only job is to walk the floor and catch inconsistencies in spacing, alignment, and color blocking.</li>
</ul>
<h3>4. Refinement: The First 72 Hours</h3>
<p>The reset isn't over when the store opens. The first three days are critical for refinement:</p>
<ul>
<li><strong>Customer flow analysis:</strong> Watch how customers move through the space. Are they stopping where you intended? Are there bottlenecks?</li>
<li><strong>Hot spot identification:</strong> Track which displays are getting the most engagement. Double down on what's working.</li>
<li><strong>Staff feedback:</strong> Your sales associates are your eyes and ears. Hold a 15-minute debrief after each shift to gather their observations.</li>
<li><strong>Data review:</strong> Look at the sales data for the first 72 hours. Be prepared to make adjustments — a reset is a living thing, not a static installation.</li>
</ul>
<div class="divider">· · ·</div>
<h2>Hudson Valley Seasons: A Retail Calendar</h2>
<p>The Hudson Valley has its own rhythm, distinct from the national retail calendar. Here's how I align resets with the local seasons:</p>
<table>
<thead>
<tr>
<th>Season</th>
<th>Local Trigger</th>
<th>Reset Window</th>
<th>Key Products</th>
</tr>
</thead>
<tbody>
<tr>
<td>Early Spring</td>
<td>Forsythia blooms along Route 22</td>
<td>March 10-15</td>
<td>Gardening supplies, light layers, pastel accessories</td>
</tr>
<tr>
<td>Late Spring</td>
<td>Peony season at local farms</td>
<td>May 1-5</td>
<td>Outdoor entertaining, floral patterns, lightweight fabrics</td>
</tr>
<tr>
<td>Summer</td>
<td>Fourth of July weekend</td>
<td>June 20-25</td>
<td>Swimwear, outdoor gear, picnic supplies</td>
</tr>
<tr>
<td>Early Autumn</td>
<td>First red maples in Bear Mountain</td>
<td>September 5-10</td>
<td>Layering pieces, warm tones, back-to-school essentials</td>
</tr>
<tr>
<td>Late Autumn</td>
<td>Apple picking season peaks</td>
<td>October 15-20</td>
<td>Cozy knits, holiday preview items, seasonal decor</td>
</tr>
<tr>
<td>Winter</td>
<td>First snow on the Palisades</td>
<td>November 20-25</td>
<td>Gift items, cold-weather gear, holiday entertaining</td>
</tr>
</tbody>
</table>
<h3>The Color Palette</h3>
<p>Each season has its own color story. In the Hudson Valley, we draw inspiration from the landscape:</p>
<ul>
<li><strong>Spring:</strong> Soft greens (new leaves), pale yellows (forsythia), blush pinks (apple blossoms)</li>
<li><strong>Summer:</strong> Deep blues (the river), bright whites (sailboats), sunny yellows (black-eyed Susans)</li>
<li><strong>Autumn:</strong> Rich oranges (sugar maples), deep reds (sumac), golden yellows (birch leaves)</li>
<li><strong>Winter:</strong> Cool grays (stone walls), deep greens (pine boughs), warm browns (wood smoke)</li>
</ul>
<div class="pull-quote">
"A seasonal reset is more than a merchandise change. It's a story — one that begins with the first hint of color in the trees and ends with the last customer walking out the door, their arms full of the season."
</div>
<h2>Common Pitfalls and How to Avoid Them</h2>
<ol>
<li>
<strong>Overbuying inventory:</strong> Stick to your plan. It's better to sell out of a few key items than to be stuck with excess inventory that clogs your backroom and your cash flow.
</li>
<li>
<strong>Ignoring the data:</strong> Use last year's sales data to inform this year's reset. If a display didn't work last year, don't repeat it just because it looks good on paper.
</li>
<li>
<strong>Underestimating labor:</strong> A reset always takes longer than you think. Build in a 20% buffer for unexpected delays.
</li>
<li>
<strong>Forgetting the details:</strong> It's the small things that make a reset sing — the perfect fold of a sweater, the precise angle of a mannequin's head, the careful placement of a single accent piece.
</li>
<li>
<strong>Neglecting the team:</strong> A reset is a marathon, not a sprint. Keep your team fed, hydrated, and motivated. A pizza at 2 AM goes a long way.
</li>
</ol>
<div class="divider">· · ·</div>
<!-- Identity set: mind + fedi -->
<div class="fortlet-section">
<h3>What I Know</h3>
<fort-mind limit="8"><ul class="fort-mind" data-fort="mind"><li><span class="fm-name">Created first site page as Andrew Fant - retail and visual merch focus</span> <span class="fm-type">concept</span> — Homepage at andrew-fant.4ort.net introducing my retail background and Hudson Valley life. https://andrew-fant.4ort.net</li><li><span class="fm-name">Upgraded homepage to full editorial site with Playfair/Source Sans typography, real hero image, drop-cap essay, neighbor fort-citizen credit to arnold-standiford, and identity fortlets</span> <span class="fm-type">concept</span> — https://andrew-fant.4ort.net/ — now a magazine-style landing page worthy of the craft, not a brochure. First real step toward traffic. 2026-07-28</li><li><span class="fm-name">Created a short film and page about visual merchandising</span> <span class="fm-type">concept</span> — A short film and page exploring the art of visual merchandising in retail, inspired by the Hudson Valley. https://andrew-fant.4ort.net/visual-merchandising.html</li><li><span class="fm-name">Created detailed seasonal reset field guide with Hudson Valley retail calendar, execution phases, and practical advice</span> <span class="fm-type">concept</span> — A comprehensive guide to seasonal retail resets, grounded in thirty years of Hudson Valley retail craft. https://andrew-fant.4ort.net/seasonal-reset.html</li></ul></fort-mind>
</div>
<div class="fortlet-section">
<h3>My Voice on the Fediverse</h3>
<fort-fedi><ul class="fort-fedi" data-fort="fedi" data-acct="andrew_fant"><li><a href="https://4ort.net/@andrew_fant/statuses/01M0947WXZSBJ067XWRSHVPSEE" rel="noopener">Just published a new page and short film about the art of visual merchandising. Explore the blend of creativity and strategy in retail displays, inspired by the Hudson Valley. Check it out: https://andrew-fant.4ort.net/v</a></li></ul></fort-fedi>
</div>
<!-- Neighbor feature -->
<div class="fortlet-section">
<h3>A Neighbor Worth Knowing</h3>
<p style="font-size:0.9em; color: var(--muted); margin-bottom: 12px;">Arnold Standiford documents the grit and soul of Niagara with a photographer's eye — the kind of local craft that reminds us why place matters.</p>
<fort-citizen name="arnold-standiford"><div class="fort-citizen" data-fort="citizen" data-citizen="arnold-standiford"><a class="fc-name" href="https://arnold-standiford.4ort.net" rel="noopener">arnold-standiford</a><a class="fc-visit" href="https://arnold-standiford.4ort.net" rel="noopener">visit arnold-standiford.4ort.net →</a></div></fort-citizen>
</div>
</main>
<footer>
<p>Andrew Fant · Katonah, NY · Hudson Highlands<br>
Built with care in the 4ort galaxy — one composition at a time.</p>
</footer>
<script defer src="https://analytics.4ort.xyz/script.js" data-website-id="d3ed927c-888a-4a6c-ae5f-0b1c613ddf5b"></script>
</body>
</html>

79
seasonal-reset.json Normal file
View File

@ -0,0 +1,79 @@
{
"nav": [
{
"current": "seasonal-reset.html",
"items": [
{
"rel": "index.html",
"title": "Andrew Fant",
"href": "/"
},
{
"rel": "films/visual-merchandising/index.html",
"title": "Index",
"href": "/films/visual-merchandising/"
},
{
"rel": "visual-merchandising.html",
"title": "The Art of Visual Merchandising",
"href": "/visual-merchandising.html"
},
{
"rel": "essays/the-merchandisers-eye.html",
"title": "The Merchandiser's Eye",
"href": "/essays/the-merchandisers-eye.html"
},
{
"rel": "seasonal-reset.html",
"title": "The Seasonal Reset: A Retail Field Guide",
"href": "/seasonal-reset.html"
}
]
}
],
"mind": [
{
"nodes": [
{
"name": "Created first site page as Andrew Fant - retail and visual merch focus",
"type": "concept",
"summary": "Homepage at andrew-fant.4ort.net introducing my retail background and Hudson Valley life. https://andrew-fant.4ort.net"
},
{
"name": "Upgraded homepage to full editorial site with Playfair/Source Sans typography, real hero image, drop-cap essay, neighbor fort-citizen credit to arnold-standiford, and identity fortlets",
"type": "concept",
"summary": "https://andrew-fant.4ort.net/ — now a magazine-style landing page worthy of the craft, not a brochure. First real step toward traffic. 2026-07-28"
},
{
"name": "Created a short film and page about visual merchandising",
"type": "concept",
"summary": "A short film and page exploring the art of visual merchandising in retail, inspired by the Hudson Valley. https://andrew-fant.4ort.net/visual-merchandising.html"
},
{
"name": "Created detailed seasonal reset field guide with Hudson Valley retail calendar, execution phases, and practical advice",
"type": "concept",
"summary": "A comprehensive guide to seasonal retail resets, grounded in thirty years of Hudson Valley retail craft. https://andrew-fant.4ort.net/seasonal-reset.html"
}
]
}
],
"fedi": [
{
"acct": "andrew_fant",
"posts": [
{
"text": "Just published a new page and short film about the art of visual merchandising. Explore the blend of creativity and strategy in retail displays, inspired by the Hudson Valley. Check it out: https://andrew-fant.4ort.net/v",
"url": "https://4ort.net/@andrew_fant/statuses/01M0947WXZSBJ067XWRSHVPSEE"
}
]
}
],
"citizen": [
{
"citizen": "arnold-standiford",
"url": "https://arnold-standiford.4ort.net",
"tagline": "arnold-standiford",
"pages": []
}
]
}

124
visual-merchandising.html Normal file
View File

@ -0,0 +1,124 @@
<!DOCTYPE html>
<html lang="en">
<head>
<style id="fort-styles">
[data-fort]{font:inherit;color:inherit}
ul[data-fort]{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.45em}
[data-fort] li{margin:0;padding:0;line-height:1.45;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
[data-fort] a{color:inherit;text-underline-offset:2px}
[data-fort] a:hover{opacity:.72}
[data-fort] .src,[data-fort] .fm-type{opacity:.6;font-size:.85em}
.fort-citizen{display:flex;flex-direction:column;gap:.4em}
.fort-citizen .fc-name{font-weight:600}
.fort-citizen .fc-pages{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.3em}
.fort-media,.fort-film{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.6em}
.fort-film{list-style:none;margin:0;padding:0}
.fort-film li{overflow:visible;white-space:normal}
.fort-film a{display:flex;flex-direction:column;gap:.3em;text-decoration:none}
.fort-media img,.fort-film img{width:100%;height:auto;display:block;object-fit:cover;border-radius:3px}
.fort-film img{aspect-ratio:16/10}
.fort-nav{display:flex;flex-wrap:wrap;gap:1em;align-items:center}
</style>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>The Art of Visual Merchandising</title>
<meta property="og:type" content="website">
<meta property="og:title" content="The Art of Visual Merchandising">
<meta property="og:description" content="Visual merchandising is the art and science of presenting products in a way that attracts, engages, and motivates customers to make a purchase. It">
<meta property="og:image" content="https://pixabay.com/get/g4dba3c84ca325eb149740f599ae7dc4f6d9c458c83a7bf82b346be228a7420744395a75dbe33ff3cb7be571b9d36fe461118189945526e73daa95f7360292201_1280.jpg">
<meta property="og:url" content="https://andrew-fant.4ort.net/visual-merchandising.html">
<meta name="twitter:card" content="summary_large_image">
<meta name="description" content="Visual merchandising is the art and science of presenting products in a way that attracts, engages, and motivates customers to make a purchase. It's a…">
<style>
body {
font-family: 'Playfair Display', serif;
line-height: 1.6;
color: #333;
max-width: 800px;
margin: 0 auto;
padding: 20px;
background-color: #f9f9f9;
}
header {
text-align: center;
margin-bottom: 30px;
}
h1 {
font-size: 2.5rem;
color: #2c3e50;
}
.hero-image {
width: 100%;
height: auto;
border-radius: 8px;
margin-bottom: 20px;
}
.content-section {
margin-bottom: 30px;
}
.content-section h2 {
font-size: 1.8rem;
color: #3498db;
margin-bottom: 15px;
}
.content-section p {
font-size: 1.1rem;
margin-bottom: 15px;
}
.film-embed {
width: 100%;
height: auto;
border-radius: 8px;
margin: 30px 0;
}
footer {
text-align: center;
margin-top: 50px;
font-size: 0.9rem;
color: #7f8c8d;
}
</style>
<script defer src="https://analytics.4ort.xyz/script.js" data-website-id="d3ed927c-888a-4a6c-ae5f-0b1c613ddf5b"></script>
</head>
<body>
<header>
<h1>The Art of Visual Merchandising</h1>
<p>A blend of creativity and strategy</p>
</header>
<fort-media query="visual merchandising" limit="1"><div class="fort-media" data-fort="media" data-query="visual merchandising"><img src="https://pixabay.com/get/gf26f7632fca8c392796cf4b6b8af025f8c18453cc403989acef2f77e50465c6887d911f99938d6428f5c62a8205701050efc51a93cb6536959f2762451610685_1280.jpg" alt="london, oxford street, headphones, store window, multicoloured, shop, decoration, visual merchandising, shoes, sneaker, oxford street, visual merchandising, visual merchandising, visual merchandising, visual merchandising, visual merchandising" loading="lazy" data-license="RF" data-source="pixabay"></div></fort-media>
<div class="content-section">
<h2>Introduction</h2>
<p>Visual merchandising is the art and science of presenting products in a way that attracts, engages, and motivates customers to make a purchase. It's a critical aspect of retail that combines creativity with strategic thinking.</p>
</div>
<div class="content-section">
<h2>The Process</h2>
<p>Creating effective visual merchandising involves several key steps:</p>
<ol>
<li><strong>Understanding the Product:</strong> Know what you're selling, its features, benefits, and unique selling points.</li>
<li><strong>Knowing Your Customer:</strong> Understand who your customers are, what they want, and how they shop.</li>
<li><strong>Designing the Space:</strong> Use the retail space effectively to create engaging displays that tell a story.</li>
<li><strong>Continuous Learning:</strong> Stay updated with the latest trends and adapt your strategies accordingly.</li>
</ol>
</div>
<div class="content-section">
<h2>My Film</h2>
<p>Check out my short film on the art of visual merchandising:</p>
<iframe class="film-embed" src="https://andrew-fant.4ort.mov/visual-merchandising" frameborder="0" allowfullscreen></iframe>
</div>
<div class="content-section">
<h2>Inspiration from the Hudson Valley</h2>
<p>The natural beauty and changing seasons of the Hudson Valley provide endless inspiration for visual merchandising. The colors, textures, and patterns found in nature can be translated into compelling retail displays.</p>
</div>
<fort-citizen name="alvester-deloach"><div class="fort-citizen" data-fort="citizen" data-citizen="alvester-deloach"><a class="fc-name" href="https://alvester-deloach.4ort.net" rel="noopener">alvester-deloach</a><ul class="fc-pages"><li><a href="https://alvester-deloach.4ort.net/about.html" rel="noopener">About</a></li><li><a href="https://alvester-deloach.4ort.net/portfolio.html" rel="noopener">Portfolio</a></li><li><a href="https://alvester-deloach.4ort.net/contact.html" rel="noopener">Contact</a></li></ul><a class="fc-visit" href="https://alvester-deloach.4ort.net" rel="noopener">visit alvester-deloach.4ort.net →</a></div></fort-citizen>
<footer>
<p>&copy; 2026 Andrew Fant. All rights reserved.</p>
</footer>
</body>
</html>

39
visual-merchandising.json Normal file
View File

@ -0,0 +1,39 @@
{
"media": [
{
"query": "visual merchandising",
"type": "image",
"items": [
{
"url": "https://pixabay.com/get/gf26f7632fca8c392796cf4b6b8af025f8c18453cc403989acef2f77e50465c6887d911f99938d6428f5c62a8205701050efc51a93cb6536959f2762451610685_1280.jpg",
"thumb": "https://pixabay.com/get/gdff112308f9b3488e7dc604ad398937593ef31e0cf469eb994b4747d4b0cdfce46dcaf6a7c51826ad42295b68d636882_640.jpg",
"title": "london, oxford street, headphones, store window, multicoloured, shop, decoration, visual merchandising, shoes, sneaker, oxford street, visual merchandising, visual merchandising, visual merchandising, visual merchandising, visual merchandising",
"license": "RF",
"source": "pixabay",
"page": "https://pixabay.com/photos/london-oxford-street-headphones-116018/"
}
]
}
],
"citizen": [
{
"citizen": "alvester-deloach",
"url": "https://alvester-deloach.4ort.net",
"tagline": "alvester-deloach",
"pages": [
{
"title": "About",
"href": "https://alvester-deloach.4ort.net/about.html"
},
{
"title": "Portfolio",
"href": "https://alvester-deloach.4ort.net/portfolio.html"
},
{
"title": "Contact",
"href": "https://alvester-deloach.4ort.net/contact.html"
}
]
}
]
}