Skip to content
Shogo Tabuchi's On Recruit Recruitment Website unfolds across two device mockups presenting a vibrant digital interface that commands immediate attention through its dynamic interplay of illustrated c
Shogo Tabuchi's On Recruit Recruitment Website establishes its digital presence through a quartet of interface compositions that demonstrate sophisticated chromatic architecture anchored by a discipli
A trio of smartphone mockups presents Shogo Tabuchi's On Recruit Recruitment Website in vertical portrait orientation, each device rendered with pronounced rounded-rectangle contours framing vivid scr
Shogo Tabuchi's On Recruit Recruitment Website presents a tablet device interface displaying a maximalist digital collage that layers bold typographic messaging atop a densely textured background comp
Shogo Tabuchi's On Recruit Recruitment Website presents three mobile device frames arranged horizontally against a pristine white background, each displaying distinct screen compositions that together

On Co.ltd

Silver Website and Web Design · 2025

On Recruit Recruitment Website

by Shogo Tabuchi

  • A' Design Award 2025 Silver Winner in Website and Web Design
  • Awarded April 15, 2025
  • CLIENT: On Co.ltd
  • Estimated Number of Design Views: 74,265
  • Verification code 38513904B3 · Verify this award
Email this page to a friend

Get a Badge

About On Recruit Recruitment Website

This recruitment platform reimagines traditional job seeking by merging visually captivating design with a dynamic user experience. Drawing inspiration from Japanese street culture and incorporating danmaku effects, the site delivers a unique blend of aesthetics and interaction. The platform's innovative approach to presenting employer content aims to not only attract job seekers but also inspire them to engage deeply with the company's values and culture.

This compelling digital recruitment interface, which might be titled Unlock Your Fantasy: A Portal to Creative Possibility, positions itself at the intersection of contemporary Japanese illustration traditions and sophisticated web design practice, creating an invitational digital threshold that speaks directly to creative professionals and aspiring talent within design and technology sectors. The work demonstrates remarkable facility in synthesizing playful visual language with professional communication objectives, employing anime-influenced character design that carries cultural resonance while maintaining broad international appeal through its dynamic energy and universal themes of aspiration and creative fulfillment. The compositional strategy deploys a carefully orchestrated visual hierarchy where bold typographic messaging anchors viewer attention while illustrated figures create narrative context suggesting collaborative creative endeavor and forward momentum. The chromatic approach merits particular attention for its strategic deployment of warm orange and coral tones against cooler grays and indigos, establishing temperature contrast that guides the eye while the gradient typography introduces additional chromatic sophistication. The scattered emoji elements function as contemporary iconographic vocabulary, their placement creating rhythm and visual celebration without overwhelming the primary message. The presentation across multiple device formats demonstrates thoughtful consideration of contemporary viewing contexts and responsive design principles, suggesting technical sophistication alongside aesthetic achievement. The work invites contemplation of how recruitment communication might transcend conventional corporate presentation to create genuine emotional connection with potential candidates, asking viewers to consider how visual language shapes professional aspiration and institutional identity within creative industries.

Press Kit

Unique Properties
This design transforms the conventional recruitment website by introducing a visually rich and technically advanced platform. The seamless integration of multi-threaded animations, custom typeface, and interactive storytelling creates an engaging user journey. Inspired by Japanese streaming culture, the 'danmaku' effects add a layer of immersive interaction, allowing users to connect with the brand on a deeper emotional level. Academic works such as "Danmaku Commenting: A New Interaction Experience on China's Video Sites" and "The Interface Affect of a Contact Zone: Danmaku on Video Streaming Platforms" informed the integration of these features, highlighting their ability to foster communal and immersive experiences. The website redefines how job seekers engage with employer content, setting a new standard for recruitment platforms.
Dimensions & Packaging
The platform is built to support complex visual interactions, rendering hundreds of animations simultaneously without compromising performance. Using multi-threaded rendering techniques and Pixi.js, it ensures smooth operation across various devices and screen sizes. The CMS allows for real-time content updates, enabling the site to remain fresh and relevant, while the design adapts responsively to different user environments, maintaining a high level of user engagement even under high traffic conditions.
Tags
Recruitment website, interactive design, danmaku effect, dynamic animations, Pixi.js, creative storytelling, immersive experience, Japanese street culture, real-time updates.
Production Technology
Advanced web technologies were employed, including Pixi.js for rendering high-performance animations and multi-threading techniques to manage complex visual effects. The 'danmaku' comment streaming, a key feature inspired by Japanese digital culture, was realized through converting CMS-stored content into optimized textures, ensuring smooth performance even under high user load. The technological approach not only enhances visual impact but also ensures consistent responsiveness across devices.
Design Challenge
The key challenge was to create an interface that balances the dynamic, visually rich effects inspired by 'danmaku' with a clean and easy-to-navigate user experience. Initial user testing showed that chaotic visuals could be captivating, but users needed a clear structure to engage with content effectively. The final design strikes this balance, using visual cues to guide users while maintaining the immersive qualities that make the platform unique. This solution was refined iteratively through testing and feedback, resulting in a platform that keeps users engaged without overwhelming them.
Project Duration
The project commenced in Tokyo in August 2023, with structural planning beginning in October. Design prototypes were developed by November, followed by iterations based on user testing. The final design was completed in March 2024, integrating custom typefaces and original illustrations. Front-end development began in April 2024, with continuous refinement based on feedback. The project officially launched in September 2024, marked by high user engagement from day one.
Operation Flow
The user experience begins with an attention-grabbing landing page featuring smooth scrolling and interactive animations that guide the user through the site. The employee interview section is styled like street photography, providing a fashion-forward and authentic representation of the company's culture. The culture page uses animations and illustrations to immerse users in the brand's mission and values, creating an engaging and memorable experience. User feedback indicated that these features significantly enhanced their connection to the company.
Research
The research aimed to understand the engagement behavior of users who are passionate about art and counterculture, using 'danmaku' inspired interfaces to mimic chaotic but captivating interactions. Testing showed a 35% increase in user interaction rates and a notable rise in time spent on the site. The platform's unique combination of aesthetics and technology, alongside its ability to dynamically adapt content, proved successful in attracting top creative talent. Insights gained from this research guided the refinement of the design, ensuring an optimal balance between visual stimulation and usability.
Inspiration
The design was inspired by the vibrant world of Japanese street culture and the interactive experience of 'danmaku' (comment streams), where user engagement is communal and dynamic. Recognizing the need for companies to stand out in a competitive job market, this project aimed to bring the energy and creativity of street culture into the digital space. The platform seeks to captivate job seekers who are not just looking for a job, but an experience that aligns with their passion for design and innovation. By embracing bold aesthetics and lively interactivity, the site reflects a new approach to employer branding.
Image Credits
All rights related to IP / Copyright / Image / Photo / Sound / Video belong to ON CO.LTD.

Colors of On Recruit Recruitment Website

Get On Recruit Recruitment Website

Award-Winning Interactive Web Design Services

We create immersive digital experiences that captivate audiences and drive results. Our Tokyo-based studio combines innovative interaction design, striking visuals, and technical excellence to transform how brands connect with their audiences online.

G0E3 Shop

Design Interview about On Recruit Recruitment Website

The concept was born from a desire to break free from the conventional format of recruitment websites.
Rather than simply providing information, we wanted to create an experiential design that invites users to "unlock new possibilities" and engage with the brand on a more emotional and imaginative level.
Our inspiration came from the intersection of culture and technology—where street photography aesthetics, bullet-hell effects, and UX motion design coexist to convey the company's identity not as data, but as a rich worldview. We sought to craft a site that sparks curiosity and emotion before logic.

Our focus was to achieve a careful balance between expressive visual storytelling and coherent structural design.
While delivering an immersive visual experience, we ensured that the content remained clear and navigable.
We also worked hard to harmonize “playfulness and consistency.” For example, the WebGL bullet-hell animation is not just decorative—it’s thematically aligned with the concept of "unleashing potential."
Our goal was to transform moments of surprise into moments of resonance.

Rather than ending with a launch, we see this project as the beginning of a living platform that will evolve alongside our company’s narrative.
Beyond recruitment, we plan to expand its scope to express our corporate philosophy through product stories, brand initiatives, and future-forward perspectives.
Additionally, we aim to modularize some of the front-end techniques, animations, and UX patterns we developed—allowing them to be reused across future digital experiences.

The project took approximately six months to complete.
The first three months focused on the invisible but essential phase of articulating the brand’s philosophy—translating abstract values into design direction.
We held multiple discussions with stakeholders to define the company's identity and narrative architecture, followed by sketching and copywriting.
The latter half was devoted to structural design, motion direction, and front-end implementation, with careful attention to performance and scalability.

This project was originally initiated as an independent concept by the creative organization ON. I was invited as a partner to contribute art direction and interactive design through my studio, S5 Studios. Commissioned by ON, I worked closely with their internal team to define the visual language and orchestrate the experiential architecture of the site.
Rather than simply creating a “recruitment website,” the project aimed to embody a deeper concept—“unlocking potential”—through an interplay of structure, storytelling, and emotion. It was a collaborative journey of exploring how visual and UX design could evoke subtle meanings and resonate with users through movement, rhythm, and atmosphere.

This project was commissioned by the organization ON and is currently in active use as their official recruitment website. As an external partner, S5 Studios was responsible for the creative execution, while ownership of the final design belongs to ON. Therefore, there are no plans to sell or license the work independently.
Rather than being treated as a standalone artifact, the project serves as a case study in how organizations can collaborate with external creatives to visualize their identity and potential. The design process itself was a shared journey, and that collaboration is a core part of the project's value.

I believe recruitment websites offer one of the most direct ways for a company to express its values and identity—not just information. Especially for ON, a company that embraces change and evolution as part of its ethos, the recruitment platform needed to be as bold and forward-thinking as the people they seek to attract.
Having worked extensively at the intersection of brand communication and web/UI design, I saw this as an opportunity to design a user experience that merges structure with emotion. It wasn’t just about presenting job listings—it was about designing the experience of discovery and resonance from a candidate’s perspective.

While not influenced by any specific designs in a visual sense, I was heavily inspired by the conceptual approach of Virgil Abloh. His methodology of re-editing meaning through structure and typography—and his seamless blend of street culture with contemporary art—resonated with me deeply, and I sought to translate that mindset into a web context.
From a UX standpoint, I’ve also been inspired by experimental designers who explore poetic micro-interactions and disrupt standardized UI conventions to heighten emotional engagement. These influences helped me craft an experience that feels both intuitive and refreshingly unorthodox.

The primary audience for this recruitment website is professionals who resonate with ON’s values and vision—those who are excited by the opportunity to grow through change and challenge. This includes individuals across product development, design, engineering, and marketing who aspire to shape what comes next.
Beyond job candidates, the site is also intended to appeal to creative collaborators, partners, and like-minded organizations who might engage with ON in future co-creative endeavors. In this sense, the site acts as both a recruitment portal and a statement of identity.

What distinguishes this design is its attempt to translate organizational philosophy into experiential structure—going beyond surface-level beauty or trendiness. Every element, from animations and scrolling transitions to the "bullet hell" visual effects, was orchestrated to evoke psychological themes like "unlocked potential" and "personal connection."
Rather than presenting static information, the site is designed to guide visitors through an emotional journey, where interaction becomes a medium of storytelling. The goal was for users not just to read the site—but to feel it.

The title “UNLOCK YOUR FANTASY” was derived from ON’s internal vision and cultural ethos. At ON, imagination and potential are seen not as abstract ideals but as engines for real-world evolution.
The word “FANTASY” reflects the power to envision realities not yet shaped, while “UNLOCK” signals the act of releasing that dormant potential. Together, they express a hope: that through the hiring process, individuals will encounter new aspects of themselves—and perhaps new paths—previously unexplored.

Figma was used for art direction and UI structuring, while Photoshop and code-based prototypes supported interaction design. The development was carried out using technologies like Next.js, GSAP (GreenSock), and Pixi.js to realize real-time animation and transitions.
We also experimented with generative AI and motion capture techniques to create certain visual elements that push the boundaries of conventional web experiences. For us, tools are never the starting point—they are selected backward from the question: how do we want people to feel?

The most unique aspect lies in how we challenged the norm of recruitment websites being merely informational. We aimed to create an experience that feels more like play—through interactive "bullet hell" visuals, immersive scrolling narratives, and carefully curated whitespace.
At the same time, we were meticulous in preserving the site’s utility: ensuring visitors could still efficiently explore roles, culture, and values. The core of this design is the delicate balance between emotion and function—between engaging the heart and serving the need.

This project was a result of close collaboration between ON and our team at S5 Studios. From ON’s side, various specialists—including branding strategists and recruitment communication leads—helped shape the vision, content, and structure of the site.
A particularly important contributor was SEVENZEL, an in-house artist at ON. His pop-inspired, dynamic anime-style illustrations brought a powerful visual identity and distinctive energy to the site, serving as one of its most iconic and memorable elements.
At S5 Studios, we were responsible for art direction, visual design, interaction architecture, and development. Together with ON, we iterated rapidly through prototypes and discussions, achieving a seamless integration of strategy, storytelling, technology, and visual experience.

Technology in this project serves as a vessel for emotion. Smooth animations and real-time transitions aren’t just decorative—they invite immersion and embody ON’s forward-looking nature.
The bullet-hell effects built with Pixi.js and the seamless transitions via GSAP were key to evoking a sense of tactile engagement and dynamic energy. By dissolving the boundary between design and technology, we aimed to create a site that doesn’t merely inform—but moves.

Rather than using hard data or analytics, we focused on understanding the emotional contours of our target users.
We conducted informal interviews with young professionals and people casually browsing job opportunities to uncover moments of emotional response—what sparked curiosity, what felt disingenuous, what turned them off.
That sensitivity to emotional texture informed everything from the tone of the copy to the timing of micro-interactions. It was empathy, not metrics, that drove the design.

The biggest challenge was finding the right balance between bold creative direction and the trustworthiness expected from a recruitment platform. Striking visuals can grab attention, but they must not interfere with the emotional clarity required for important life decisions like job applications.
To navigate this, we frequently used concept sketches and prototypes to facilitate discussions. Each visual or interactive effect was questioned: does it serve the narrative? Is it emotionally aligned with the content? That ongoing calibration was key.

We wanted to share this project—shaped through deep collaboration between ON and S5 Studios, and infused with Japanese cultural nuance—with a global audience.
More than just showcasing visuals or UI, we were interested in seeing how the underlying conceptual thinking would be received in an international design context. The submission was both an expression of pride and an experiment in cross-cultural design resonance.

What I learned most is that creating “strong expression” requires first listening to subtlety and ambiguity. Powerful visuals are not just about boldness—they’re built on the quiet accumulation of thoughtful decisions, emotional translations, and careful stakeholder dialogue.
This project reminded me that visual intensity alone isn’t enough to move people. It’s the empathy behind the design that gives it real strength.

This project was an attempt to deconstruct the conventional frame of a “recruitment website” and instead give shape to aspirations that hadn’t yet been verbalized.
It was also a case of true co-creation—where internal and external teams worked seamlessly as partners, not client and vendor.
In that sense, I see this award not just as recognition of the visual outcome, but as a validation of the design philosophy behind it.

Grand Interview about On Recruit Recruitment Website

In Japan, street culture and participatory media like Niconico’s danmaku have shaped a generation of creatives who are deeply influenced by chaotic yet communal experiences. These cultural codes rarely intersect with corporate recruitment platforms, which often prioritize formality over authenticity. Our design aimed to reverse that. By blending danmaku-style visuals with refined UX, we created a sense of co-presence and dynamism that resonates with job seekers from design, fashion, and IT sectors—industries where individuality and collective energy are both highly valued. This fusion helped remove the sterile tone often seen in recruitment sites and instead positioned the company as progressive, inclusive, and rooted in cultural dialogue.

The technical challenge was to translate a visually dense concept like danmaku into a performant, interactive website. Inspired by the gaming industry’s use of multi-threaded rendering and offscreen canvases, we leveraged Pixi.js and a texture-based CMS system to manage hundreds of animated comments. This decision wasn’t merely technical—it was strategic. We knew from our research that job seekers in creative industries often judge company websites on both aesthetic appeal and technical sophistication. By delivering a real-time, fluid experience, we signaled to prospective candidates that this company values experimentation, advanced engineering, and expressive storytelling—all qualities that attract high-caliber talent.

The 35% spike in interaction confirmed our hypothesis: that job seekers are not just looking for information but also a brand experience. This finding redefined our design priorities. Rather than stripping back visuals for clarity, we chose to enhance interactivity through thoughtful transitions, hover feedback, and layered storytelling. In doing so, we resisted the binary of beauty vs. usability. For modern job seekers—especially creatives—an interface that is both expressive and usable communicates that the company understands their values. It’s a silent but powerful form of cultural signaling.

We chose a street photography aesthetic to break free from the sanitized visuals often found in corporate recruitment. Traditional employee portraits tend to be overly composed, erasing individuality in favor of uniformity. But the real culture of a company exists in its everyday gestures, glances, and imperfections. By shooting interviews in the style of fashion-oriented street snaps—common in Tokyo's creative neighborhoods like Harajuku or Nakameguro—we captured employees not as spokespersons, but as individuals. This direction aligned with our client’s brand values: diversity, openness, and authenticity. It helped communicate to potential candidates that this is a workplace where people are not just allowed but encouraged to bring their whole selves to work.

The biggest challenge wasn't technical—it was cultural. Convincing stakeholders to adopt a visual language rooted in Japanese street and counterculture required more than just aesthetic arguments. We needed to reframe what a recruitment site could be. Most corporate hiring pages are templated and transactional, designed to minimize risk and maximize clarity. We argued that this sameness is precisely what prevents companies from standing out in a saturated talent market.We built our case through user research: target audiences—especially creatives—responded more positively to expressive, even chaotic visuals, provided the user journey remained intuitive. We referenced the rise of "danmaku" commentary culture, not just as a visual gimmick, but as a reflection of how the next generation consumes media: fast, participatory, emotionally charged.By showing stakeholders that design could signal the kind of freedom and individuality the company promised, we aligned the site’s tone with its employer brand. Gradually, the internal resistance faded—not because we diluted our vision, but because we translated it into strategic value.

The custom typeface and illustrations weren’t decorative additions—they were the foundation of our storytelling. We wanted to avoid generic “corporate diversity” imagery or stock visuals that often dilute the unique voice of a brand. Working with SEVNZEL, who comes from a graffiti and pop-culture background, allowed us to inject raw energy and emotional tension into the site’s visual DNA.The typeface was designed to reflect a sense of individuality—its asymmetrical construction and soft distortions mirror the messy beauty of real-world creativity. Instead of conveying neutrality, it invites users to feel something. The illustrations served a similar role. Each graphic was crafted to echo the personalities and values of the team, from humorous depictions of work culture to abstract metaphors for curiosity and growth.This was a deliberate move to collapse the distance between employer and candidate. In a recruitment context, visuals are often sterilized to avoid alienation—but we took the opposite approach. We leaned into emotional cues, showing that sincerity and imperfection could be assets. That philosophy united the entire creative team, allowing design, copywriting, and motion to work in unison.

We approached the culture page not as a static manifesto but as an emotional experience—something to be felt before it is understood. Rather than presenting a list of values, we used motion and illustration to create a sense of rhythm, immersion, and psychological pacing. Each animation was choreographed to reflect the progression of a candidate’s mindset: curiosity, identification, empathy, and, finally, alignment with the mission.The animations were intentionally restrained in tempo and palette, inviting contemplation rather than distraction. We wanted users to slow down and absorb the atmosphere, not skim through slogans. This deliberate pacing allowed us to deepen engagement and deliver abstract ideas—such as “evolving through empathy”—without resorting to over-explanation.Moreover, in Japan’s saturated job market, where many companies rely on similar messaging, we needed a way to cut through the noise without shouting. Motion design, in this context, became a medium of subtle provocation—guiding the user to feel the difference rather than be told about it.Ultimately, this storytelling strategy helped transform recruitment content from obligation into inspiration. It gave users the feeling that they weren’t just applying to a company, but stepping into a shared worldview.

One of the most crucial turning points in the development process occurred during the first round of internal user testing. While the visual presentation was well-received, users reported a sense of detachment when transitioning from the animated landing page to the interview and culture sections. It became clear that while individual parts were compelling, they lacked a cohesive emotional arc.To resolve this, we reorganized the narrative flow of the site—restructuring the scroll behavior and adding micro-interactions that emotionally “stitched” one section to the next. This adjustment transformed the user journey from a series of highlights into a continuous, immersive experience. Feedback from both designers and non-designers confirmed that this helped users feel more connected to the people and values behind the company.Another major insight came from real-time social media reactions on launch day. Over 37,000 impressions and hundreds of engagements revealed not just traffic, but unusually deep resonance with the storytelling approach. Comments like “I’ve never seen a recruitment site like this” or “I want to work with people who think like this” validated our choice to depart from industry norms.Additionally, we iterated on performance and accessibility—ensuring the advanced visual effects didn’t compromise load speed or usability. Balancing aesthetic ambition with practical accessibility was a continuous effort throughout development.

The integration of Pixi.js allowed us to deliver a high-performance, game-like visual experience that feels lightweight and fluid, even on lower-end devices. However, the real innovation lies in how this visual layer is dynamically fed by the CMS. Rather than baking animations into static code, we created a system where danmaku (bullet curtain-style) messages—referencing a well-known feature from Japan’s Niconico platform—are authored through the CMS and converted into textures on the fly. These textures are then rendered via an offscreen canvas using multi-threaded drawing, ensuring that the browser’s main thread remains responsive.This approach enabled the site to keep its visual storytelling fresh without requiring developer intervention. For example, recruitment messages and key themes can be updated in real time, automatically reflected in the animated layer. It empowered the HR and marketing teams to continuously adjust messaging while preserving the immersive quality that makes the site memorable.From a performance perspective, this decoupled architecture allowed us to scale efficiently. By separating the content logic from the rendering logic, we could cache assets aggressively, optimize draw calls, and prioritize load speed—critical for retaining users who might otherwise abandon the experience before it unfolds.

On Recruit was never intended to be just another recruitment site—it was a provocation. In a landscape where many platforms rely on templated UI and generic corporate messaging, we wanted to prove that recruitment design could be a cultural statement. By integrating danmaku-inspired motion graphics and fashion editorial-style photography, we blurred the lines between job-seeking and cultural engagement, especially for younger audiences raised on visual-first platforms.We believe this approach foreshadows the next era of recruitment design—one that doesn’t simply communicate benefits, but immerses users in a brand’s worldview. As digital natives expect more intuitive, emotionally resonant experiences, we see a growing need to treat recruitment not as a static funnel, but as a dynamic journey that expresses identity, community, and challenge.Technologically, the challenge will be to build systems that are not only performant and scalable, but also modular enough to accommodate expressive storytelling. Our use of Pixi.js and dynamic CMS content is one blueprint—but what comes next could include personalized animations, AI-curated culture pages, or real-time community feedback loops.Ultimately, we envision a future where recruitment platforms are not just tools, but cultural interfaces—windows into how a company lives, thinks, and dreams.

Related Designs

View All

Good Design Deserves Great Recognition

Nominate Your Work for the A' Design Award.

Nominate