Big and Small Underwater Faces — 3rd Place. Trips to the Antarctic Peninsula always yield amazing encounters with leopard seals (Hydrurga leptonyx). Boldly approaching me and baring his teeth, this individual was keen to point out that this part of Antarctica was his territory. This picture was shot at dusk, resulting in the rather moody atmosphere.   Credit: Lars von Ritter Zahony (Germany) / World Ocean’s Day Get the Popular Science daily newsletter💡 Breakthroughs, discoveries, and DIY tips sent every weekday. The striking eye of a humpback whale named Sweet Girl peers at the camera. Just four days later, she would be dead, hit by a speeding boat and one of the 20,000 whales killed by ship strikes each year. Photographer Rachel Moore’s captivating image (seen below) of Sweet Girl earned top honors at the 2025 United Nations World Oceans Day Photo Competition. Wonder: Sustaining What Sustains Us — WinnerThis photo, taken in Mo’orea, French Polynesia in 2024, captures the eye of a humpback whale named Sweet Girl, just days before her tragic death. Four days after I captured this intimate moment, she was struck and killed by a fast-moving ship. Her death serves as a heartbreaking reminder of the 20,000 whales lost to ship strikes every year. We are using her story to advocate for stronger protections, petitioning for stricter speed laws around Tahiti and Mo’orea during whale season. I hope Sweet Girl’s legacy will spark real change to protect these incredible animals and prevent further senseless loss.Credit: Rachel Moore (USA) / United Nations World Oceans Day www.unworldoceansday.org Now in its twelfth year, the competition coordinated in collaboration between the UN Division for Ocean Affairs and the Law of the Sea, DivePhotoGuide (DPG), Oceanic Global, and  the Intergovernmental Oceanographic Commission of UNESCO. Each year, thousands of underwater photographers submit images that judges award prizes for across four categories: Big and Small Underwater Faces, Underwater Seascapes, Above Water Seascapes, and Wonder: Sustaining What Sustains Us. This year’s winning images include a curious leopard seal, a swarm of jellyfish, and a very grumpy looking Japanese warbonnet. Given our oceans’ perilous state, all competition participants were required to sign a charter of 14 commitments regarding ethics in photography. Underwater Seascapes — Honorable MentionWith only orcas as their natural predators, leopard seals are Antarctica’s most versatile hunters, preying on everything from fish and cephalopods to penguins and other seals. Gentoo penguins are a favored menu item, and leopard seals can be observed patrolling the waters around their colonies. For this shot, I used a split image to capture both worlds: the gentoo penguin colony in the background with the leopard seal on the hunt in the foreground.Credit: Lars von Ritter Zahony (Germany) / United Nations World Oceans Day www.unworldoceansday.org Above Water Seascapes – WinnerA serene lake cradled by arid dunes, where a gentle stream breathes life into the heart of Mother Earth’s creation: Captured from an airplane, this image reveals the powerful contrasts and hidden beauty where land and ocean meet, reminding us that the ocean is the source of all life and that everything in nature is deeply connected. The location is a remote stretch of coastline near Shark Bay, Western Australia.Credit: Leander Nardin (Austria) / United Nations World Oceans Day www.unworldoceansday.org Above Water Seascapes — 3rd PlaceParadise Harbour is one of the most beautiful places on the Antarctic Peninsula. When I visited, the sea was extremely calm, and I was lucky enough to witness a wonderfully clear reflection of the Suárez Glacier (aka Petzval Glacier) in the water. The only problem was the waves created by our speedboat, and the only way to capture the perfect reflection was to lie on the bottom of the boat while it moved towards the glacier.Credit: Andrey Nosik (Russia) / United Nations World Oceans Day www.unworldoceansday.org Underwater Seascapes — 3rd Place“La Rapadura” is a natural hidden treasure on the northern coast of Tenerife, in the Spanish territory of the Canary Islands. Only discovered in 1996, it is one of the most astonishing underwater landscapes in the world, consistently ranking among the planet’s best dive sites. These towering columns of basalt are the result of volcanic processes that occurred between 500,000 and a million years ago. The formation was created when a basaltic lava flow reached the ocean, where, upon cooling and solidifying, it contracted, creating natural structures often compared to the pipes of church organs. Located in a region where marine life has been impacted by once common illegal fishing practices, this stunning natural monument has both geological and ecological value, and scientists and underwater photographers are advocating for its protection. (Model: Yolanda Garcia)Credit: Pedro Carrillo (Spain) / United Nations World Oceans Day www.unworldoceansday.org Underwater Seascapes — WinnerThis year, I had the incredible opportunity to visit a jellyfish lake during a liveaboard trip around southern Raja Ampat, Indonesia. Being surrounded by millions of jellyfish, which have evolved to lose their stinging ability due to the absence of predators, was one of the most breathtaking experiences I’ve ever had.Credit: Dani Escayola (Spain) / United Nations World Oceans Day www.unworldoceansday.org Underwater Seascapes — 2nd PlaceThis shot captures a school of rays resting at a cleaning station in Mauritius, where strong currents once attracted them regularly. Some rays grew accustomed to divers, allowing close encounters like this. Sadly, after the severe bleaching that the reefs here suffered last year, such gatherings have become rare, and I fear I may not witness this again at the same spot.Credit: Gerald Rambert (Mauritius) / United Nations World Oceans Day www.unworldoceansday.org Wonder: Sustaining What Sustains Us — 3rd PlaceShot in Cuba’s Jardines de la Reina—a protected shark sanctuary—this image captures a Caribbean reef shark weaving through a group of silky sharks near the surface. Using a slow shutter and strobes as the shark pivoted sharply, the motion blurred into a wave-like arc across its head, lit by the golden hues of sunset. The abundance and behavior of sharks here is a living symbol of what protected oceans can look like.Credit: Steven Lopez (USA) / United Nations World Oceans Day www.unworldoceansday.org  Above Water Seascapes — 2nd PlaceNorthern gannets (Morus bassanus) soar above the dramatic cliffs of Scotland’s Hermaness National Nature Reserve, their sleek white bodies and black-tipped wings slicing through the Shetland winds. These seabirds, the largest in the North Atlantic, are renowned for their striking plunge-dives, reaching speeds up to 100 kph (60 mph) as they hunt for fish beneath the waves. The cliffs of Hermaness provide ideal nesting sites, with updrafts aiding their take-offs and landings. Each spring, thousands return to this rugged coastline, forming one of the UK’s most significant gannet colonies. It was a major challenge to take photos at the edge of these cliffs at almost 200 meters (650 feet) with the winds up to 30 kph (20 mph).Credit: Nur Tucker (UK/Turkey) / United Nations World Oceans Day www.unworldoceansday.org Above Water Seascapes — Honorable MentionA South Atlantic swell breaks on the Dungeons Reef off the Cape Peninsula, South Africa, shot while photographing a big-wave surf session in October 2017. It’s the crescendoing sounds of these breaking swells that always amazes me.Credit: Ken Findlay (South Africa) / United Nations World Oceans Day www.unworldoceansday.org Wonder: Sustaining What Sustains Us — Honorable MentionHumpback whales in their thousands migrate along the Ningaloo Reef in Western Australia every year on the way to and from their calving grounds. In four seasons of swimming with them on the reef here, this is the only encounter I’ve had like this one. This pair of huge adult whales repeatedly spy-hopped alongside us, seeking to interact with and investigate us, leaving me completely breathless. The female in the foreground was much more confident than the male behind and would constantly make close approaches, whilst the male hung back a little, still interested but shy. After more than 10 years working with wildlife in the water, this was one of the best experiences of my life.Credit: Ollie Clarke (UK) / United Nations World Oceans Day www.unworldoceansday.org Big and Small Underwater Faces — 2nd PlaceOn one of my many blackwater dives in Anilao, in the Philippines, my guide and I spotted something moving erratically at a depth of around 20 meters (65 feet), about 10 to 15 centimeters in size. We quickly realized that it was a rare blanket octopus (Tremoctopus sp.). As we approached, it opened up its beautiful blanket, revealing its multicolored mantle. I managed to take a few shots before it went on its way. I felt truly privileged to have captured this fascinating deep-sea cephalopod. Among its many unique characteristics, this species exhibits some of the most extreme sexual size-dimorphism in nature, with females weighing up to 40,000 times more than males.Credit: Giacomo Marchione (Italy) / United Nations World Oceans Day www.unworldoceansday.org Big and Small Underwater Faces – WinnerThis photo of a Japanese warbonnet (Chirolophis japonicus) was captured in the Sea of Japan, about 50 miles (80 kilometers) southwest of Vladivostok, Russia. I found the ornate fish at a depth of about 30 meters (100 feet), under the stern of a shipwreck. This species does not appear to be afraid of divers—on the contrary, it seems to enjoy the attention—and it even tried to sit on the dome port of my camera.Credit: Andrey Nosik (Russia) / United Nations World Oceans Day www.unworldoceansday.org Wonder: Sustaining What Sustains Us — 2nd PlaceA juvenile pinnate batfish (Platax pinnatus) captured with a slow shutter speed, a snooted light, and deliberate camera panning to create a sense of motion and drama. Juvenile pinnate batfish are known for their striking black bodies outlined in vibrant orange—a coloration they lose within just a few months as they mature. I encountered this restless subject in the tropical waters of Indonesia’s Lembeh Strait. Capturing this image took patience and persistence over two dives, as these active young fish constantly dart for cover in crevices, making the shot particularly challenging.Credit: Luis Arpa (Spain) / United Nations World Oceans Day www.unworldoceansday.org

FORM Brands Studio has given London’s Air Ambulance Charity a new look. Rather than transporting patients to hospital, the charity’s doctors and paramedics treat seriously injured people at the scene from its two helicopters and eight cars. It is the only organisation performing this role in London. Established in 1989, it is called to a rising number of patients across the capital every year, helping more than 2,000 people in 2024. London’s Air Ambulance Charity (LAAC) needs £17m a year to operate, 96% which comes from donations. “But 60% of Londoners don’t know we’re a charity,” says LAAC’s director of fundraising and marketing, Jayne Clarke. FORM Brands Studio identity for London’s Air Ambulance Charity in OOH posters Its new organisational strategy is about raising awareness, enhancing fundraising efforts and strengthening its connection with London’s communities. “We’re trying to make sure the strategy is about hope and looking forward to the future,” Clarke says. To accompany this new strategy, the charity also decided to change up its visual identity. “Our previous branding was very corporate,” Clarke admits.FORM Brands Studio won the job after a pitch. Strategy director Beth Andlaw set up the east London agency in 2022 with creative director Alex Andlaw. Before that she had been in comms and PR, and had worked with LAAC on and off for about 20 years. FORM Brands Studio identity for London’s Air Ambulance Charity on stage FORM introduced a new wordmark, colour palette, typeface, icons, motion, creative copy, messaging, fundraising memorabilia and photography. However, the existing helicopter icon was retained. “It has a lot of love and legacy,” says Clarke. The agency’s brand idea, Propelling Promise, was inspired by the urgent, intense nature of the work carried out by LAAC’s clinical and operational crews. That was used to give structure to creative copy lines and the new tone of voice. Each lead line includes an element of “propelling” to imply urgency and momentum, and “promise” to imply warmth and hope. That resulted in lines including “Trauma doesn’t stop. Neither do we” and “Here for London. Today, tomorrow, always.” FORM brought in Peggy Nyamekye to work on the copywriting. Meanwhile, the visual identity, developed with designer Mayan Mistry, comprises a gradient design system, drawing on the rotational motion of helicopter blades. Borough names are repeated in radiating patterns and overlaid with the gradient. Red is still central to the charity’s identity, but FORM introduced the vivid orange worn by medics on-scene. “These colours blend in the gradient, creating a visual signature that speaks to urgency, action, optimism and hope,” says Alex Andlaw. https://d3faj0w6aqatyx.cloudfront.net/uploads/2025/06/LAA_OOH_TUBE_1920x1080.mp4 With the help of motion graphics designer Matt Fowler, the agency introduced movement to the branding, to reflect the aircraft’s blades in flight. The logo’s new wordmark is in Barlow, inspired by the existing big white lettering on the helicopter tail booms. Before, the charity’s name was written lower case in a thinner font. “Now it’s bigger, bolder and more impactful,” says Alex Andlaw. FORM also redesigned the icons to have more personality but still be functional. “The icons help the team talk about quite hard subjects,” he says, such as casualties, and the designs had to balance warmth and realism. “We did quite a few hearts, some look too detailed and some too basic,” he explains. The agency also created a series of collectible badges, inspired by the embroidered badges worn by the charity’s doctors and pilots.FORM Brands Studio identity for London’s Air Ambulance Charity in Instagram posts Meanwhile, photographer James Pearson-Howes was briefed to capture real people, places and moments from across London. The new branding had to resonate with very different types of donors, from the charity’s collection buckets to seven-figure corporate donations, says Clarke. “And the doctors wearing the brand have very strong opinions, as do the pilots. FORM took in all these views and managed to make all those people happy.” https://d3faj0w6aqatyx.cloudfront.net/uploads/2025/06/LAA_OOH_BILLBOARD_1920x1080.mp4 FORM Brands Studio identity for London’s Air Ambulance Charity FORM Brands Studio identity for London’s Air Ambulance Charity in OOH posters

“Is that concrete all around, or is it in my head?” asked Ian Hunter in “All the Young Dudes,” the song David Bowie wrote for Mott the Hoople in 1972. Concrete is all around us, and we haven’t quite wrapped our heads around it. It’s one of the indispensable materials of modernity; as we try to decarbonize the built environment, it’s part of the problem, and innovations in its composition may become part of the solution. Understanding its history more clearly, the Skyscraper Museum’s new exhibition in Manhattan implies, just might help us employ it better. Concrete is “the second most used substance in the world, after water,” the museum’s founder/director/curator Carol Willis told AN during a recent visit. For plasticity, versatility, and compressive strength, reinforced concrete is hard to beat, though its performance is more problematic when assessed by the metric of embodied and operational carbon, a consideration the exhibition acknowledges up front. In tall construction, concrete has become nearly hegemonic, yet its central role, contend Willis and co-curator Thomas Leslie, formerly of Foster + Partners and now a professor at the University of Illinois, Urbana-Champaign, is underrecognized by the public and by mainstream architectural history. The current exhibition aims to change that perception. The Skyscraper Museum in Lower Manhattan features an exhibition, The Modern Concrete Skyscraper, which examines the history of material choices in building tall towers. (Courtesy the Skyscraper Museum) The Modern Concrete Skyscraper examines the history of tall towers’ structural material choices, describing a transition from the early dominance of steel frames to the contemporary condition, in which most large buildings rely on concrete. This change did not happen instantly or for any single reason but through a combination of technical and economic factors, including innovations by various specialists, well-recognized and otherwise; the availability of high-quality limestone deposits near Chicago; and the differential development of materials industries in nations whose architecture grew prominent in recent decades. As supertalls reach ever higher—in the global race for official height rankings by the Council on Tall Buildings and Urban Habitat (CTBUH) and national, corporate, or professional bragging rights—concrete’s dominance may not be permanent in that sector, given the challenge of pumping the material beyond a certain height. (The 2,717-foot Burj Khalifa, formerly Burj Dubai, uses concrete up to 1,987 and steel above that point; Willis quotes SOM’s William Baker describing it as “the tallest steel building with a concrete foundation of 156 stories.”) For the moment, however, concrete is ahead of its chief competitors, steel and (on a smaller scale) timber. Regardless of possible promotional inferences, Willis said, “we did not work with the industry in any way for this exhibition.” “The invention of steel and the grid of steel and the skeleton frame is only the first chapter of the history of the skyscraper,” Willis explained. “The second chapter, and the one that we’re in now, is concrete. Surprisingly, no one had ever told that story of the skyscraper today with a continuous narrative.” The exhibition traces the use of concrete back to the ancient Roman combination of aggregate and pozzolana—the chemical formula for which was “largely lost with the fall of the Roman Empire,” though some Byzantine and medieval structures approximated it. From there, the show explores comparable materials’ revival in 18th-century England, the patenting of Portland cement by Leeds builder Joseph Aspdin in 1824, the proof-of-concept concrete house by François Coignet in 1856, and the pivotal development of rebar in the mid-19th century, with overdue attention to Ernest Ransome’s 1903 Ingalls Building in Cincinnati, then the world’s tallest concrete building at 15 stories and arguably the first concrete skyscraper. The exhibition includes a timeline that depicts concrete’s origins in Rome to its contemporary use in skyscraper construction. (Courtesy the Skyscraper Museum) Baker’s lectures, Willis reported, sometimes pose a deceptively simple question: “‘What is a skyscraper?’ In 1974, when the World Trade Center and Sears Tower are just finished, you would say it’s a very tall building that is built of steel, an office building in North America. But if you ask that same question today, the answer is: It’s a building that is mixed-use, constructed of concrete, and [located] in Asia or the Middle East.” The exhibition organizes the history of concrete towers by eras of engineering innovation, devoting special attention to the 19th- and early-20th-century “patent era” of Claude Allen Porter Turner (pioneer in flat-slab flooring and mushroom columns) and Henry Chandlee Turner (founder of Turner Construction), Ransome (who patented twisted-iron rebar), and François Hennebique (known for the re-inforced concrete system exemplified by Liverpool’s Royal Liver Building, the world’s tallest concrete office building when completed in 1911). In the postwar era, “concrete comes out onto the surface [as] both a structural material and aesthetic.” Brutalism, perhaps to some observers’ surprise, “does not figure very large in high-rise design,” Willis said, except for Paul Rudolph’s Tracey Towers in the Bronx. The exhibition, however, devotes considerable attention to the work of Pier Luigi Nervi, Bertrand Goldberg (particularly Marina City), and SOM’s Fazlur Khan, pioneer of the structural tube system in the 1960s and 1970s—followed by the postmodernist 1980s, when concrete could express either engineering values or ornamentation. The exhibition highlights a number of concrete towers, including Paul Rudolph’s Tracey Towers in the Bronx. (Courtesy the Skyscraper Museum) “In the ’90s, there were material advances in engineering analysis and computerization that helped to predict performance, and so buildings can get taller and taller,” Willis said. The current era, if one looks to CTBUH rankings, is dominated by the supertalls seen in Dubai, Shanghai, and Kuala Lumpur, after the Petronas Towers (1998) “took the title of world’s tallest building from North America for the first time and traumatized everybody about that.” The previous record holder, Chicago’s Sears (now Willis) Tower, comprised steel structural tubes on concrete caissons; with Petronas, headquarters of Malaysia’s national petroleum company of that name, a strong concrete industry was represented but a strong national steel industry was lacking, and as Willis frequently says, form follows finances. In any event, by the ’90s concrete was already becoming the standard material for supertalls, particularly on soft-soiled sites like Shanghai, where its water resistance and compressive strength are well suited to foundation construction. Its plasticity is also well suited to complex forms like the triangular Burj, Kuala Lumpur’s Merdeka 118, and (if eventually completed) the even taller Jeddah Tower, designed to “confuse the wind,” shed vortices, and manage wind forces. Posing the same question Louis Kahn asked about the intentions of a brick, Willis said, with concrete “the answer is: anything you want.” The exhibition is front-loaded with scholarly material, presenting eight succinct yet informative wall texts on the timeline of concrete construction. The explanatory material is accompanied by ample photographs as well as structural models on loan from SOM, Pelli Clarke & Partners, and other firms. Some materials are repurposed from the museum’s previous shows, particularly Supertall! (2011–12) and Sky High and the Logic of Luxury (2013–14). The models allow close examination of the Burj Khalifa, Petronas Towers, Jin Mao Tower, Merdeka 118, and others, including two unbuilt Chicago projects that would have exceeded 2,000 feet: the Miglin-Beitler Skyneedle (Cesar Pelli/Thornton Tomasetti) and 7 South Dearborn (SOM). The Burj, Willis noted, was all structure and no facade for a time: When its curtain-wall manufacturer, Schmidlin, went bankrupt in 2006, it “ended up going to 100 stories without having a stitch of glass on it,” temporarily becoming a “1:1 scale model of the structural system up to 100 stories.” Its prominence justifies its appearance here in two models, including one from RWDI’s wind-tunnel studies. Eero Saarinen’s only skyscraper, built for CBS in 1965 and also known as “Black Rock,” under construction in New York City. (Courtesy Eero Saarinen Collection, Manuscripts, and Archives, Yale University Library) The exhibition opened in March, with plans to stay up at least through October (Willis prefers to keep the date flexible), with accompanying lectures and panels to be announced on the museum’s website (skyscraper.org). Though the exhibition’s full textual and graphic content is available online, the physical models alone are worth a trip to the Battery Park City headquarters. Intriguing questions arise from the exhibition without easy answers, setting the table for lively discussion and debate. One is whether the patenting of innovations like Ransome bar and the Système Hennebique incentivized technological progress or hindered useful technology transfer. Willis speculated, “Did the fact that there were inventions and patents mean that competition was discouraged, that the competition was only in the realm of business, rather than advancing the material?” A critical question is whether research into the chemistry of concrete, including MIT’s 2023 report on the self-healing properties of Roman pozzolana and proliferating claims about “green concrete” using alternatives to Portland cement, can lead to new types of the material with improved durability and lower emissions footprints. This exhibition provides a firm foundation in concrete’s fascinating history, opening space for informed speculation about its future. Bill Millard is a regular contributor to AN.

SVG animations take me back to the Hanna-Barbera cartoons I watched as a kid. Shows like Wacky Races, The Perils of Penelope Pitstop, and, of course, Yogi Bear. They inspired me to lovingly recreate some classic Toon Titles using CSS, SVG, and SMIL animations. But getting animations to load quickly and work smoothly needs more than nostalgia. It takes clean design, lean code, and a process that makes complex SVGs easier to animate. Here’s how I do it. Start Clean And Design With Optimisation In Mind Keeping things simple is key to making SVGs that are optimised and ready to animate. Tools like Adobe Illustrator convert bitmap images to vectors, but the output often contains too many extraneous groups, layers, and masks. Instead, I start cleaning in Sketch, work from a reference image, and use the Pen tool to create paths. Tip: Affinity Designer (UK) and Sketch (Netherlands) are alternatives to Adobe Illustrator and Figma. Both are independent and based in Europe. Sketch has been my default design app since Adobe killed Fireworks. Beginning With Outlines For these Toon Titles illustrations, I first use the Pen tool to draw black outlines with as few anchor points as possible. The more points a shape has, the bigger a file becomes, so simplifying paths and reducing the number of points makes an SVG much smaller, often with no discernible visual difference. Bearing in mind that parts of this Yogi illustration will ultimately be animated, I keep outlines for this Bewitched Bear’s body, head, collar, and tie separate so that I can move them independently. The head might nod, the tie could flap, and, like in those classic cartoons, Yogi’s collar will hide the joins between them. Drawing Simple Background Shapes With the outlines in place, I use the Pen tool again to draw new shapes, which fill the areas with colour. These colours sit behind the outlines, so they don’t need to match them exactly. The fewer anchor points, the smaller the file size. Sadly, neither Affinity Designer nor Sketch has tools that can simplify paths, but if you have it, using Adobe Illustrator can shave a few extra kilobytes off these background shapes. Optimising The Code It’s not just metadata that makes SVG bulkier. The way you export from your design app also affects file size. Exporting just those simple background shapes from Adobe Illustrator includes unnecessary groups, masks, and bloated path data by default. Sketch’s code is barely any better, and there’s plenty of room for improvement, even in its SVGO Compressor code. I rely on Jake Archibald’s SVGOMG, which uses SVGO v3 and consistently delivers the best optimised SVGs. Layering SVG Elements My process for preparing SVGs for animation goes well beyond drawing vectors and optimising paths — it also includes how I structure the code itself. When every visual element is crammed into a single SVG file, even optimised code can be a nightmare to navigate. Locating a specific path or group often feels like searching for a needle in a haystack. That’s why I develop my SVGs in layers, exporting and optimising one set of elements at a time — always in the order they’ll appear in the final file. This lets me build the master SVG gradually by pasting it in each cleaned-up section. For example, I start with backgrounds like this gradient and title graphic. Instead of facing a wall of SVG code, I can now easily identify the background gradient’s path and its associated linearGradient, and see the group containing the title graphic. I take this opportunity to add a comment to the code, which will make editing and adding animations to it easier in the future: <svg ...> <defs> <!-- ... --> </defs> <path fill="url(#grad)" d="…"/> <!-- TITLE GRAPHIC --> <g> <path … /> <!-- ... --> </g> </svg> Next, I add the blurred trail from Yogi’s airborne broom. This includes defining a Gaussian Blur filter and placing its path between the background and title layers: <svg ...> <defs> <linearGradient id="grad" …>…</linearGradient> <filter id="trail" …>…</filter> </defs> <!-- GRADIENT --> <!-- TRAIL --> <path filter="url(#trail)" …/> <!-- TITLE GRAPHIC --> </svg> Then come the magical stars, added in the same sequential fashion: <svg ...> <!-- GRADIENT --> <!-- TRAIL --> <!-- STARS --> <!-- TITLE GRAPHIC --> </svg> To keep everything organised and animation-ready, I create an empty group that will hold all the parts of Yogi: <g id="yogi">...</g> Then I build Yogi from the ground up — starting with background props, like his broom: <g id="broom">...</g> Followed by grouped elements for his body, head, collar, and tie: <g id="yogi"> <g id="broom">…</g> <g id="body">…</g> <g id="head">…</g> <g id="collar">…</g> <g id="tie">…</g> </g> Since I export each layer from the same-sized artboard, I don’t need to worry about alignment or positioning issues later on — they’ll all slot into place automatically. I keep my code clean, readable, and ordered logically by layering elements this way. It also makes animating smoother, as each component is easier to identify. Reusing Elements With <use> When duplicate shapes get reused repeatedly, SVG files can get bulky fast. My recreation of the “Bewitched Bear” title card contains 80 stars in three sizes. Combining all those shapes into one optimised path would bring the file size down to 3KB. But I want to animate individual stars, which would almost double that to 5KB: <g id="stars"> <path class="star-small" fill="#eae3da" d="..."/> <path class="star-medium" fill="#eae3da" d="..."/> <path class="star-large" fill="#eae3da" d="..."/> <!-- ... --> </g> Moving the stars’ fill attribute values to their parent group reduces the overall weight a little: <g id="stars" fill="#eae3da"> <path class="star-small" d="…"/> <path class="star-medium" d="…"/> <path class="star-large" d="…"/> <!-- ... --> </g> But a more efficient and manageable option is to define each star size as a reusable template: <defs> <path id="star-large" fill="#eae3da" fill-rule="evenodd" d="…"/> <path id="star-medium" fill="#eae3da" fill-rule="evenodd" d="…"/> <path id="star-small" fill="#eae3da" fill-rule="evenodd" d="…"/> </defs> With this setup, changing a star’s design only means updating its template once, and every instance updates automatically. Then, I reference each one using <use> and position them with x and y attributes: <g id="stars"> <!-- Large stars --> <use href="#star-large" x="1575" y="495"/> <!-- ... --> <!-- Medium stars --> <use href="#star-medium" x="1453" y="696"/> <!-- ... --> <!-- Small stars --> <use href="#star-small" x="1287" y="741"/> <!-- ... --> </g> This approach makes the SVG easier to manage, lighter to load, and faster to iterate on, especially when working with dozens of repeating elements. Best of all, it keeps the markup clean without compromising on flexibility or performance. Adding Animations The stars trailing behind Yogi’s stolen broom bring so much personality to the animation. I wanted them to sparkle in a seemingly random pattern against the dark blue background, so I started by defining a keyframe animation that cycles through different opacity levels: @keyframes sparkle { 0%, 100% { opacity: .1; } 50% { opacity: 1; } } Next, I applied this looping animation to every use element inside my stars group: #stars use { animation: sparkle 10s ease-in-out infinite; } The secret to creating a convincing twinkle lies in variation. I staggered animation delays and durations across the stars using nth-child selectors, starting with the quickest and most frequent sparkle effects: /* Fast, frequent */ #stars use:nth-child(n + 1):nth-child(-n + 10) { animation-delay: .1s; animation-duration: 2s; } From there, I layered in additional timings to mix things up. Some stars sparkle slowly and dramatically, others more randomly, with a variety of rhythms and pauses: /* Medium */ #stars use:nth-child(n + 11):nth-child(-n + 20) { ... } /* Slow, dramatic */ #stars use:nth-child(n + 21):nth-child(-n + 30) { ... } /* Random */ #stars use:nth-child(3n + 2) { ... } /* Alternating */ #stars use:nth-child(4n + 1) { ... } /* Scattered */ #stars use:nth-child(n + 31) { ... } By thoughtfully structuring the SVG and reusing elements, I can build complex-looking animations without bloated code, making even a simple effect like changing opacity sparkle. Then, for added realism, I make Yogi’s head wobble: @keyframes headWobble { 0% { transform: rotate(-0.8deg) translateY(-0.5px); } 100% { transform: rotate(0.9deg) translateY(0.3px); } } #head { animation: headWobble 0.8s cubic-bezier(0.5, 0.15, 0.5, 0.85) infinite alternate; } His tie waves: @keyframes tieWave { 0%, 100% { transform: rotateZ(-4deg) rotateY(15deg) scaleX(0.96); } 33% { transform: rotateZ(5deg) rotateY(-10deg) scaleX(1.05); } 66% { transform: rotateZ(-2deg) rotateY(5deg) scaleX(0.98); } } #tie { transform-style: preserve-3d; animation: tieWave 10s cubic-bezier(0.68, -0.55, 0.27, 1.55) infinite; } His broom swings: @keyframes broomSwing { 0%, 20% { transform: rotate(-5deg); } 30% { transform: rotate(-4deg); } 50%, 70% { transform: rotate(5deg); } 80% { transform: rotate(4deg); } 100% { transform: rotate(-5deg); } } #broom { animation: broomSwing 4s cubic-bezier(0.5, 0.05, 0.5, 0.95) infinite; } And, finally, Yogi himself gently rotates as he flies on his magical broom: @keyframes yogiWobble { 0% { transform: rotate(-2.8deg) translateY(-0.8px) scale(0.998); } 30% { transform: rotate(1.5deg) translateY(0.3px); } 100% { transform: rotate(3.2deg) translateY(1.2px) scale(1.002); } } #yogi { animation: yogiWobble 3.5s cubic-bezier(.37, .14, .3, .86) infinite alternate; } All these subtle movements bring Yogi to life. By developing structured SVGs, I can create animations that feel full of character without writing a single line of JavaScript. Try this yourself: See the Pen Bewitched Bear CSS/SVG animation [forked] by Andy Clarke. Conclusion Whether you’re recreating a classic title card or animating icons for an interface, the principles are the same: Start clean, Optimise early, and Structure everything with animation in mind. SVGs offer incredible creative freedom, but only if kept lean and manageable. When you plan your process like a production cell — layer by layer, element by element — you’ll spend less time untangling code and more time bringing your work to life.

Developers have a ‘clearer path’ to pursue architects who design unsafe buildings following a recent Supreme Court ruling, legal experts have warned The judgement, which interprets important elements of the Building Safety Act 2022 (BSA) and the Defective Premises Act 1972 (DPA), heightens the need for practices to hold ‘comprehensive’ professional indemnity (PI) insurance, according to top lawyers. Earlier this month (21 May) the Supreme Court ruled that BDW, the main trading arm of Barratt Developments, was able to pursue damages from structural engineering company URS for alleged negligence in provision of design services for two residential schemes. This was despite BDW undertaking remedial works on the properties voluntarily more than three years ago and no longer owning the buildings. Judges dismissed the engineering firm’s latest appeal against BDW’s right to claim for compensation on all four grounds.Advertisement Nick Stockley, partner at law firm Mayo Wynne Baxter, said: ‘This ruling creates an easier route for builders to reclaim losses that they incur for the actions of design contractors. ‘It suggests that the time-out defence is no longer a fail-safe if the genuine blame rests with a design contractor. The ruling also takes away any voluntary-decision defence that either a design contractor or architect may try to raise. ‘It means that any design contractor needs to maintain insurance that extends to their work, irrespective of when the work was carried out. ‘An architect’s work should always be covered by professional indemnity insurance but that cover will need to be more extensive. An architect should review any existing insurance policy cover in order to check that that policy extends to all work carried out by the architect.’ The two projects at the centre of the BDW claim are Capital East in London and Freemens Meadow in Leicester. Advertisement The housebuilder carried out voluntary remedial works at these properties in 2020 and 2021, despite no longer owning them, after defects were discovered that created a danger to occupants.   It claimed damages from URS but the engineering firm appealed, initially to the Court of Appeal then to the Supreme Court, arguing that a voluntary act could not lead to recoverable losses, and only claims brought by a property owner under the DPA were subject to an extended 30-year limitation period.  URS claimed that a third party could not be owed a duty under the DPA and added that a contribution for liability could only be made once a settlement was finalised.  However, the Supreme Court found in BDW’s favour, saying that URS’s interpretation of the law ‘would penalise responsible developers, such as such as BDW, who had been pro-active in investigating, identifying and remedying building safety defects’.  It said DPA would ‘better serve the policy of ensuring the safety of dwellings’ if it had a wider application, ruling that ‘BDW itself has rights under the DPA against a party primarily liable for the defects’.  It added that BDW had ‘acted responsibly’ and ‘in accordance with the government’s strong encouragement’ in carrying out remediation work at Capital East and Freemens Meadow, concluding: ‘Penalisation of [such] developers would be contrary to the purpose of the legislation’. Rob Horne, head of construction disputes for Osbourne Clarke, which represented BDW, said: ‘For residential developers there is now significantly more clarity over the full effect of the retrospective limitation period introduced by the BSA. ‘Ultimately, the aim of the BSA was to ensure that safety failures are properly addressed and that those responsible bear the costs. This case furthers that aim by ensuring that developers have a clearer path to recover funds from designers and constructors who designed and built unsafe buildings.’  Horne added: ‘The Supreme Court has commented that proactive developers who, in effect, do the right thing in effecting necessary safety works, should not be penalised by having rights of recovery barred.  ‘Such developers are able to recover the remedial costs from those most responsible for the safety defects in question.’  ‘This reading gives the Defective Premises Act far more teeth’ Julia Tobbell, partner at law firm Forsters, said the decision will be ‘a relief to proactive developers’ as, ‘although their decision to voluntarily take on repairs may be a factor in assessing reasonableness of mitigation, it does not bar them in principle from being able to recover from negligent contractors’.  She added: ‘The court also found that the duty to build homes properly under Section 1 of the PDA is not just for the benefit of the homeowner, but also the developer who procures the contractor to carry out the works.   ‘The developer can both owe a duty (to the homeowner) and be owed a duty (by the contractor); this reading gives the DPA far more teeth.’  2025-05-30 Will Ing comment and share

May 22, 20255 min readHow One Astronomer Helped to Discover Nearly 200 Moons of SaturnScientific American spoke with the astronomer who has contributed to the discovery of two thirds of Saturn’s known moonsBy Meghan Bartels edited by Lee Billings NASA, ESA, John T. Clarke (Boston University), Zolt G. Levay (STScI)A mere decade ago, astronomers knew of just 62 moons around Saturn. Today the ringed planet boasts a staggering 274 official satellites. That’s more than any other world in the solar system—and far too many for most people to keep track of. Astronomer Edward Ashton is no exception, even though he has helped to discover 192 of them—he thinks that’s the total, anyway, after pausing to do some mental math.Ashton is now a postdoctoral fellow at the Academia Sinica Institute of Astronomy and Astrophysics in Taiwan. He fell into hunting for Saturn’s moons in 2018, when his then academic adviser suggested the project for his Ph.D. at the University of British Columbia. It has been a fruitful search. Most recently, in March, Ashton and his colleagues announced a batch of 128 newfound Saturnian satellites.Scientific American spoke with Ashton about the science of discovering so many relatively tiny moons—most of them just a few kilometers wide—using vast amounts of data gathered by the Canada-France-Hawaii Telescope (CFHT), located in Hawaii.On supporting science journalismIf you're enjoying this article, consider supporting our award-winning journalism by subscribing. By purchasing a subscription you are helping to ensure the future of impactful stories about the discoveries and ideas shaping our world today.[An edited transcript of the interview follows.]How have you found these moons?To detect the moons, we use a technique known as shifting and stacking. We take 44 sequential images of the same patch of sky over a three-hour period because, in that time frame, the moons move relative to the stars at a rate similar to Saturn. If we just stack the images normally, then the moon appears as a streak across the images, and that dilutes the signal of the moon.So what we do is: we shift the images relative to one another at multiple different rates near that of Saturn, and then we basically blink between the different shift rates. If the shift rate is not quite at the rate of the moon, then it’s going to be slightly elongated. As you get closer to the rate of the moon, then it slowly combines into a dot. And then, as you get faster than the moon’s rate, it expands again. So basically, we look at the images and then quickly blink through the different rates, and you can see the moon coalescing.That’s for a single night. But just seeing an object moving at a Saturn-like rate near Saturn doesn’t guarantee that it is a moon. It’s highly likely that the object is a moon, but that hasn’t been confirmed. So what we need to do is track the objects to show that they are in orbit around the planet. To do that, we repeat the [shift and stack] process multiple times over many months and years.Why did this happen now? Did you need new techniques and observatories to do this work?The technique and the technology have been there for a while—the same technique has been used to find moons of Neptune and Uranus. But the sky area around those planets where moons can exist is a lot smaller, so it takes less time to search through the data. One of the reasons why this hadn’t been done for Saturn is because it’s very time-consuming.Why do those other planets have less space where moons could be than Saturn does?Those planets are less massive, so the stable orbits that moons can have are smaller.I had been wondering if this technique works for other planets, and clearly the answer is yes. But do you think there are other moons that have yet to be found around Saturn or other planets with the method?We did find moon candidates around Saturn that we weren’t able to track long enough to be able to confirm them. So if you redo this technique again, you will be able to find more moons around Saturn, but this is a case of diminishing returns. If you use a larger telescope [than the CFHT], then you’d be able to see fainter moons, so you’d be able to find more.At the moment, if you use the same technique for Jupiter, you will be able to find fainter moons. The problem is: the amount of sky that moons of Jupiter can occupy is significantly larger than [the amount of sky that can be occupied by moons of] Saturn, so the method is even more time-consuming for Jupiter. And Jupiter is much brighter than Saturn and the other planets, so there’s a lot of scattered light that makes it harder to see the moons.So it’s even harder to find satellites around Jupiter, and as you mentioned, other groups have already done this work for Uranus and Neptune. Does that mean we’re sort of “maxed out” on moons until we have better observations?Yeah, you probably have to wait until better technology comes along.Is there something being built or planned right now that could be that “better technology”?There currently are telescopes that can see deeper [than the CFHT], such as the James Webb Space Telescope (JWST). The problem is: JWST’s field of view is very small, so you have to do quite a few observations to be able to cover the required area. But there is a telescope that’s set to launch pretty soon, the Nancy Grace Roman Space Telescope, that has quite a large field of view. So that’ll be a good telescope to use for hunting more moons.What do we know about these new moons?You basically can only get the moons’ orbits and approximate sizes. But if you look at the distribution of the orbits, you can understand a bit more about the history of the system. Moons that are sort of clumped together in orbital space are most likely the result of a collision, so you can see what moons come from the same parent object.Is seeing so many moons around Saturn unusual?What’s unusual is how many there are. It appears that the planets have more or less equal numbers of the larger moons. But when you get down to the smaller ones that we’re discovering, Saturn seems to shoot up in terms of the numbers. So that’s quite interesting. This could just be because there was a recent collision within the Saturnian system that produced a large number of fragments.Do you get to name them all? Do you have to name them all?I guess I don’t have to. Some of these new moons, they’ve been linked back to observations by a different group from more than 10 years ago. That’s maybe 20 to 30 of them. For the rest, we get full discovery credit, which, I think, means we get the right to name them. But they can’t be named just yet; first, they’re just given a number when they have a high-precision orbit, and I’m not sure how long that’s going to take.Do you have more moon-hunting observations to analyze?No, I’m taking a little break from moons! I’ve got other projects to work on, relating to trans-Neptunian objects. They’re quite far away. They’re hard to see. There are some mysteries about them at the moment. It’s interesting to understand their structure and how it relates to planet formation.