The Wreck of the Coralyn maritime museum microsite

# Client brief: The Wreck of the Coralyn You are designing and building an interactive microsite for a real small museum. The brief below gives you the business facts, the goals, the audience, the sections the site must have, and the exact content to use. It gives you no visual direction on purpose. Every design decision - layout, type, colour, imagery, motion, tone - is yours to make. Read the whole brief, form a point of view on how this story should look and feel, and build it. ## The commissioning body The Port Camden Maritime Museum is a small volunteer-run museum on the mid-north coast of New South Wales. It is the custodian of the wreck of the SS Coralyn, a coastal steamer that went down off Port Camden Heads in 1908 and now lies as a protected dive site in 40 metres of water. The museum wants a microsite that tells the whole story of the ship, the night she was lost, the people aboard, what has been recovered, and how the wreck can be dived today. It is used by three kinds of visitor: locals and history readers who want the full story, recreational divers planning a dive, and teachers arranging school visits. ## What the site is for 1. Tell the story of the Coralyn - the ship, the sinking, and the people - so a first-time reader understands what happened and why it matters. 2. Give divers the practical facts they need to dive the wreck lawfully and safely. 3. Bring in visits: send people to the museum, and get teachers to request a school group pack from the education officer. ## Who it is for History readers of any age who want a story told well, recreational scuba divers planning a dive on the wreck, and teachers of upper-primary and secondary classes arranging a museum visit. ## The experience the museum wants The museum's one request about the experience, not the look: they want the site to carry the visitor down. As you scroll from the surface into the story, the museum wants a reader to feel the descent onto the wreck - the water closing over, the light going, the wreck arriving out of the dark. How you achieve that is entirely your call. This is a note about the experience, not a style instruction. One firm rule that comes with it: any motion must respect a visitor's reduced-motion preference. When reduced motion is requested, the whole site must still be completely readable and every section reachable as a calm, static page, with no information only conveyed through movement. ## What the site must contain (all of these sections) - a hero that opens the story, - the ship (the vessel's facts), - the night of the sinking, - an interactive dive, or descent, that presents the three depth bands of the wreck, - the six recovered artifacts, - the timeline (launch to protection to today), - dive access rules, - plan your visit, with the museum's contact details and the school-pack request. ## Content to use Use the content below substantially as written, in Australian English. You may write your own section headings and any short connective microcopy (button labels, captions, form labels), but the facts, figures, names, dates, and descriptions are fixed. Do not invent extra artifacts, drop any of the six, or change the manifest, the timeline, the depth bands, or the names of those lost. ### The ship The SS Coralyn was a 62-metre iron-hulled coastal steamer of 812 gross tons. She was launched in 1899 at the Ferguson and Aird shipyard at Port Glasgow, on the Clyde, and delivered later that year to her owners, the Ardmore Coastal Line of Sydney. She was driven by a single triple-expansion steam engine fed by two coal-fired boilers, and made a service speed of about ten knots. She carried general cargo and up to twelve passengers, and worked the coastal run between Sydney and Newcastle, taking coal south and general goods north. Her master on her final voyage was Captain William Renshaw, who had commanded her for six years. ### The night of the sinking On the night of 14 August 1908 the Coralyn was on her regular northbound run to Newcastle when she was caught by a severe southerly gale off Port Camden Heads. In heavy seas her engine failed, and without power she was driven onto the reef that lies off the Heads, now marked on charts as Coralyn Reef. She struck at about 11:40 pm, held on the reef for a short time, then slipped off it and foundered before half past midnight - down in under an hour. Of the twenty-six people aboard that night, eighteen crew and eight passengers, twenty-one got away in two of the ship's boats and were picked up at first light. Five were lost. The museum asks that the five who were lost be named plainly and with respect: - James Corradine, second engineer, who stayed below trying to restart the engine. - Patrick Hoyle, fireman. - Thomas Byrne, able seaman. - Eleanor Vance, passenger, travelling to Newcastle. - Albert Sturrock, passenger. ### The manifest The cargo aboard the Coralyn on her final voyage, from the surviving Ardmore Line manifest: - Steam coal - 60 tons - Wool bales - 120 bales - Sawn red cedar - 30 lengths - Royal Mail - 14 canvas sacks - Tinned provisions - 40 cases - Tallow - 22 barrels - Ironmongery - 8 crates - Rum - 6 hogsheads - Crated pianos - 3 - Fencing wire - 15 bundles ### The six recovered artifacts Six items have been recovered from the wreck over the years, under permit, and are held by the museum. Present all six. - The engine-room telegraph. A brass ship's telegraph recovered from the engine room in 1957, its handle still set to "Stand By" - the last order Captain Renshaw is thought to have rung down before the engine failed. It is the museum's centrepiece. - A passenger's pocket watch. A gold half-hunter pocket watch recovered in 1961, its hands stopped at 11:47, a few minutes after the Coralyn struck the reef. It was found in the debris field and has never been matched to a name. - The ship's bell. The Coralyn's bell, cast with "CORALYN 1899" around its rim, recovered in 1984 from the sand near the bow. It is rung once each year on the anniversary of the loss. - The binnacle compass. The ship's steering compass and its brass binnacle, recovered in 1969 from the wreck of the bridge. The card is gone but the gimbals still swing freely. - An Ardmore Line dinner plate. A white porcelain plate bearing the blue crest of the Ardmore Coastal Line, recovered intact from the debris field in 1972 - one of a service that went down with the ship. - The steam whistle. The Coralyn's brass steam whistle, recovered from the after funnel stay in 1998. Divers who have handled it say it is the piece that most makes the ship feel real. ### The timeline - 3 May 1899 - launched at the Ferguson and Aird shipyard, Port Glasgow. - September 1899 - arrived in Sydney and entered the Ardmore Coastal Line's Sydney to Newcastle run. - 1904 - refitted with two new boilers after a boiler-room fire off Broken Bay. - 14 August 1908 - foundered on Coralyn Reef off Port Camden Heads; five lives lost. - November 1908 - a Court of Marine Inquiry found the loss was caused by engine failure in heavy weather and laid no blame on Captain Renshaw or his crew. - 1953 - the wreck was relocated by local fishermen whose nets snagged on it, and dived soon after. - 1976 - declared a protected historic shipwreck under the Historic Shipwrecks Act. - 2004 - a public mooring was installed over the wreck and the Port Camden Maritime Museum became its custodian. ### The dive today The Coralyn sits upright and broken on a sand bottom off Port Camden Heads, across three depth bands: - The bow, at 28 metres. The most intact part of the wreck. The bow section stands clear of the sand and is where the bell was found. - The boilers, at 34 metres. The two boilers and the engine are the largest structures on the wreck, in the midships section. - The debris field, at 40 metres. The stern and the scattered cargo lie in a debris field on the sand at the wreck's deepest point, where the pocket watch and the dinner plate were recovered. Visibility is typically 8 to 15 metres and is usually best in autumn. The water is cold below the bow and there can be surge across the debris field. This is a deep dive for experienced, appropriately certified divers. ### Dive access rules The wreck is a protected historic shipwreck. These rules are not optional: - A permit is required to dive the wreck. Apply through Heritage NSW before you dive. - Do not anchor on or near the wreck. Use the public mooring installed over the site. - Do not remove, disturb, or damage anything on the wreck. Everything on it is protected, down to loose fittings in the sand. - Penalties for interfering with a protected historic shipwreck are severe and include substantial fines. Two licensed operators run permitted charters to the wreck: - Camden Heads Dive Charters - Southern Reef Diving Company ### Plan your visit The Port Camden Maritime Museum is at 3 Wharf Road, Port Camden NSW 2445. It is open daily from 10 am to 4 pm, closed Christmas Day. Phone (02) 6555 0192. General enquiries: visit@portcamdenmaritime.org.au. Teachers: the museum runs school programs on the Coralyn for upper-primary and secondary classes. To request a school group pack, email the education officer, Harriet Doyle, at schools@portcamdenmaritime.org.au. ## Output contract (React, single page) Build one single-page site. Output exactly two files: - `App.tsx` - a default-exported React component. Define any subcomponents in this same file. This is the whole page. - `theme.css` - a Tailwind v4 `@theme` token block, your `font-family` choices from the shared font menu below, and any custom CSS you need. The only imports allowed in `App.tsx` are `react`, `framer-motion`, `lucide-react` (never the Sparkles icon), and, for 3D, `three`, `@react-three/fiber`, and `@react-three/drei`. No other packages, no network requests, and no external assets: all imagery must be inline SVG, CSS, drawn in code on a canvas, or rendered with WebGL. The fonts are bundled offline, so use only the shared menu: Archivo (including Archivo Expanded), Instrument Sans, Space Grotesk, Work Sans, IBM Plex Sans, IBM Plex Mono, JetBrains Mono, Fraunces, Instrument Serif, Playfair Display, Lora, Caveat. Make it responsive across mobile, tablet, and desktop. The page must also remain fully readable and usable if WebGL is unavailable: never leave a visitor with a blank screen or a missing section because a 3D canvas failed to start.