Backyard Eight is a Tokyo-based studio specializing in digital design, primarily for company and model web sites. With a workforce of seven and a community of exterior companions, we help firms and types of their digital communications throughout internet design, growth, artwork route, and mission administration.
What issues most to Backyard Eight is creating good work with integrity whereas persevering with to strategy web sites with a way of play. Guided by concepts akin to “good and enjoyable issues” and “playful, but humble,” we intention to construct web sites that aren’t merely visually putting, however which might be additionally efficient and dependable for each shoppers and customers.
Our Strategy
What We Worth in Net Manufacturing
At Backyard Eight, we focus not solely on visible influence, but in addition on how an internet site can energize an organization’s or model’s digital communication. We examine the context, trade, tone, and consumer touchpoints of every mission, then mix the correct info structure, visuals, movement, and interactions to design a coherent internet expertise.
The Relationship Between Design and Growth
As a result of most members of Backyard Eight work throughout each design and growth, we are able to transfer ahead with out utterly separating the 2 disciplines. By contemplating visuals, movement, interplay, and technical feasibility in parallel, we do greater than merely switch a static design to the net—we refine the way it seems to be, strikes, and responds within the browser.
CMS / Operations / Efficiency / Accessibility
At Backyard Eight, we choose the CMS and front-end structure for every mission in response to the positioning’s goal and operational construction. Taking into consideration ease of updates, expressive flexibility, operational workload, and maintainability after launch, we design flexibly—from standard CMS options to headless architectures and statically generated setups.
Efficiency and accessibility are additionally areas we take into account constantly all through manufacturing. Relying on mission necessities, we take a look at and refine loading pace, supply load, distinction, and basic accessibility, with the intention of bettering the positioning even after launch. In recent times, now we have additionally expanded our curiosity to optimization for search experiences and AI-based info understanding.
Movement / Interplay
In Backyard Eight’s web site work, movement and interplay should not handled as ornament, however as components that straight form the standard of the expertise. From the views of design, implementation, and movement, we look at pacing, the move of consideration, and responses to consumer actions, adjusting them in order that the general impression and usefulness of the positioning join naturally.
When designing these results, our first precedence is to not intrude with consumer actions or the move of content material. On that basis, we add expressions that contribute to the positioning’s character and environment. Web page transitions, scrolling, video, and WebGL are designed round every mission’s visible world and knowledge construction, with pacing and continuity refined so the expertise stays fluid and uninterrupted.
Chosen Initiatives
Backyard Eight
This was a renewal of our personal web site, created to function each a company web site and a portfolio.
Via its visuals, general expertise, and important content material—our mission case research—the positioning is designed to speak the temper of Backyard Eight and spark guests’ curiosity.
Our firm has lengthy had a tradition during which every member chooses a favourite animal and makes use of it as an icon. For this renewal, we turned these animals into characters, created 3D fashions of them, and forged them as performers who enliven the positioning. Guests are welcomed by a playful mixture of soppy motifs and aesthetics with distortion.
aircord
This was not our first time engaged on aircord’s web site. We have now collaborated on 4 renewals, and thru that course of got here to know aircord not by the genres of its work or the applied sciences it makes use of, however as a studio that mixes picture, gentle, sound, and methods to create experiences in bodily area. For that purpose, we felt {that a} standard portfolio merely arranging tasks in an orderly approach wouldn’t talk the studio’s true nature.
Our aim was to make the web site itself an area by which guests enter and transfer by aircord’s world. On the highest web page, the display screen seems as a distant three-dimensional object. In Initiatives, surfaces displaying mission footage flow into by a ring-shaped area. When a mission is chosen, the digital camera strikes nearer because the curved floor unfolds right into a aircraft and seamlessly turns into the element web page. Moderately than switching to a separate web page, the positioning modifications the state of what the viewer is already seeing, creating one steady expertise between 2D and 3D.
This continuity couldn’t be achieved by merely constructing the DOM and WebGL individually and layering them collectively. Video, typography, scrolling, digital camera motion, and shaders had been designed as a single change of state, so your complete display screen transforms throughout the similar move. As a result of the identical particular person dealt with each design and growth, we had been capable of transfer backwards and forwards between look and implementation, adjusting all the things from letterforms and movement pace to digital camera angles and lightweight depth with out fixing choices too early on both aspect.
What we created for aircord was not merely a container for its work, however an internet site that lets customers expertise the character of the studio itself by info, movement, area, and code. For Backyard Eight, this mission is among the clearest examples of design and implementation not as sequential phases, however as a single inventive act that develops concurrently.
HONKA RE:FRAME!
HONKA RE:FRAME! is a selective honors class in a brand new full-time scholarship program launched by Digital Hollywood in spring 2026. Crossing CG/VFX, XR, and UI/UX, the category asks college students to contemplate what questions they themselves will proceed to pursue in an period when AI can present solutions. For that purpose, we needed the positioning not merely to speak info, however to make every customer really feel one thing by the expertise itself.
A transparent narrative and a way of embodiment had been important to creating that have work. By embodiment, we imply human gestures that viewers can readily mission themselves onto. This led us to position a human determine on the middle of the expertise.
The problem was to keep away from confining the summary thought of a “query” to rationalization, whereas additionally stopping the visible route from changing into an empty environment. We eliminated as many cues of age and identification as potential from the determine and informed the story by gestures: stopping, reaching out, and starting to stroll. The orb within the determine’s hand is made from numerous particles; it approaches an outlined define however by no means settles into a set type.
Within the latter half, the orb disappears and the determine, beforehand standing nonetheless, begins to stroll. The expertise shifts from a interval of confronting a query to a interval of performing and creating. Moderately than explaining this in phrases, we expressed the sensation of encouraging somebody who’s about to start studying by a change within the physique itself.
The determine and animation had been created in Blender, then mixed in Three.js with particles, digital camera motion, gentle, and typography. Backyard Eight dealt with the design, 3D, and growth as one steady course of, shaping the ultimate end result whereas balancing the influence of the 3D visuals with the readability of the textual content straight within the browser.
https://college.dhw.co.jp/p/honka_reframe
PHOTOYOSHI
PHOTOYOSHI is the portfolio web site of Takamitsu Motoyoshi, a photographer primarily based in Japan. The positioning was designed to convey out the complete character of his images in a digital surroundings and supply an immersive photographic expertise.
The primary web page makes use of infinite scrolling to create a steady searching expertise that naturally leads guests from one work to the following. It additionally provides two viewing modes, permitting customers to modify seamlessly between an summary of your complete physique of labor and a centered view of particular person images. As well as, consumer actions akin to mouse motion and scrolling straight have an effect on the visible presentation of the pictures, creating the feeling of actively manipulating the images. Collectively, these mechanisms remodel searching itself into an immersive expertise.
Horizontal scrolling can improve immersion, nevertheless it additionally presents a usability problem: first-time guests could not instantly perceive the right way to navigate. To deal with this, we applied animations throughout loading and transitions that naturally talk the route of scrolling.
The positioning makes use of WordPress as its CMS, enabling directors to pick which photographs seem on the house display screen. All the web site is statically generated to optimize efficiency. Consequently, every go to to the primary web page provides a contemporary, randomized encounter with completely different images.
ANAI WOOD
The company web site for Anai Wooden Business expresses each the integrity of an organization that works with timber and its creativity in manufacturing by design and interplay.
Throughout the positioning, the visible idea is constructed round two opposing qualities: the pure individuality of timber, every rising in a different way in a forest, and the regularity launched as lumber is formed by milling. Textual content animations that develop upward, layouts that converge right into a grid because the consumer scrolls, and cross-sections of wooden that change form every time they seem translate the corporate’s actions into motion distinctive to the net.
The mission index makes use of an infinite-loop slider that may be managed by scrolling or dragging. Throughout web page transitions, the chosen picture and textual content carry over, creating an uninterrupted searching expertise. The menu background additionally includes a WebGL forest constructed with Three.js, making the corporate’s connection to forestry instantly memorable.
The system makes use of a Jamstack structure constructed with Nuxt, Contentful, and Netlify, with cautious consideration for loading pace, safety, and ease of updates. The mission balances a robust visible expression of the corporate’s identification with the sensible performance required of a company web site utilized in day-to-day operations.
plantica
plantica is a Japanese floral inventive studio led by Takashi Kimura. Its work spans a variety of fields, together with artwork, style, life-style, spatial design, installations, textiles, merchandise, and artwork route—all centered on flowers. The web site wanted each to arrange and current plantica’s various actions and to perform as a catalog of its many patterns.
Our targets had been to speak the studio’s skilled but difficult spirit, to maximise the vivid fantastic thing about its floral works, and to current its monumental quantity of tasks and pictures in a approach that felt snug and gratifying to browse.
We refined each animation and handled even loading time as a part of the route, bettering the general smoothness of the expertise. The result’s an internet site that phases every encounter with the attractive physique of labor in a sublime approach.
How We Work
Backyard Eight is a small workforce, which retains administrators, designers, and builders shut to 1 one other. We transfer tasks ahead by sharing the choices every mission requires. Moderately than separating design, implementation, movement, CMS structure, and operations, we deal with them as elements of a single internet expertise and refine them collectively.
