由設計師 Shogo Tabuchi 創作嘅 S5 Studios 主要功能：網站係備受推崇嘅 2021 A' Design Award 金獎得獎作品，獲獎類別為網頁設計。

金網頁· 2021

S5 Studios 主要功能：網站

由 Shogo Tabuchi

客戶: S5 Studios

網頁類別嘅 A' Design Award 金獎得獎者

105,836

經驗證嘅獲獎者

驗證設計 #109845 嘅獲獎狀態

喺 A' Design Award 查看新聞稿獎項徽章

色彩

設計

關於 S5 Studios 主要功能：網站

呢個網站係田渕正吾嘅作品集網站，將設計美學同表現可能性以及易於更新嘅特性結合埋一齊。2020年嘅新冠肺炎疫情，令全世界嘅藝術家喺同其他人分享自己作品時面對挑戰。呢個情況令網上推廣變得比以往任何時候都更加重要。呢個作品集網站係一個自我推廣項目，用戶可以透過視覺、聽覺同觸覺，一窺藝術家獨特嘅風格。

榮譽認可

關於A' Design Award 金獎

S5 Studios 主要功能：網站是 A' Design Award 金獎得主，這是授予一流、絕妙而傑出設計的極為崇高的認可。金獎得主是極具創新、極富遠見且璀璨奪目的創作，反映出其設計師的天才、智慧與才幹。預計S5 Studios 主要功能：網站將成為一項備受讚譽、引領潮流、氣勢恢宏的發明，帶來前所未有的價值。這件贏得 A' Design Award 金獎的設計是一個壯觀而受人敬重的項目，極大地造福並拓展藝術、科學、設計和技術的界限。S5 Studios 主要功能：網站激起強烈的渴望，喚起激情，鼓勵創造力，令我們著迷。

設計背後

新聞資料包

由設計師提供嘅製作人員名單、團隊成員同技術詳情。

獨特屬性: "Shapely, Sharp, Skillful, Splendid, Supreme."
S5 Studios is a creative studio that incorporates these five adjectives into the artist's work. It also serves as a portfolio for the commissioned works of Shogo Tabuchi.
This website places particular emphasis on presenting the artist's ideas and strengths through the design, execution, and music of the website to create a vibrant user experience that draws on unique designs and cutting-edge technology.
尺寸同包裝: Available in the latest versions of Chome, Firefox, Safari, iOS and Android
標籤: Art director, Web designer, Portfolio, Design Agencies, Promotional, 3D, GSAP Animation, PixiJS, Craft CMS, Three.js
生產技術: Pixijs and three.js allow for asynchronous browsing in all directions, while gsap and css3 are used for finer transitions and animations. Objects are efficiently managed in javascript by using fewer than 100 classes, and the website’s responsive design keeps user experience consistent across all devices.
A cms was built to update Works and Information. Due to concerns with a slow server-side cms, I used ejs to build a system that generates html automatically when Json files are updated locally.
設計挑戰: Designing a website that captures an artist’s individuality is difficult. This design is not flat but spatial in nature, so we can only imagine how users will experience this space. It took over 6 months to complete this design as I had to repeatedly tweak the user flow and visual elements.
In addition to creating materials to share the design aims with developers, the designers also complemented the work of engineers by collaborating on programming after they built the development environment.
研究: Although sites such as Awwwards feature excellent websites around the world every day, there are many websites with similar designs around.
I believe that each website should be designed differently as each brand is unique. In particular, portfolio websites must capture the artist’s individuality.
covid-19 has limited how artists can share their works, making online promotion critical for them.
It is thus important to create portfolios unique to artists by harnessing their ideas and strengths.
靈感: Designers work on new tasks by drawing inspiration from the toolbox of knowledge and experience in their mind. The design concept for this website is no different.
This website’s landing page is a dark space with floating particles, which alludes to how ideas coalesce in an abstract space. Users are led to individual sections, and as they venture deeper into the website, the thumbnails of projects are shown. Information is presented in more granular detail the deeper it is in the site hierarchy.
項目時長: October 2019 - Designing the first draft
February 2020 - How many prototypes will be designed
May 2020 - Development work begins.
　Designed 160 pages of case studies and news pages
　Music and photography production
September 2020 - Completed
October - Published on the web
操作流程: Start by selecting whether you want to browse the website with/without background music. Users can turn music on/off at any time when browsing.
Navigate the top page by clicking on a section that interests you. I have created a larger clickable area for “Works,” which brings users to a page where they can scroll through the different project categories. Clicking “Explore” brings them deeper into the site and displays a list of projects.
This site has a similar user interface on all devices.
團隊成員: Interaction Director/Designer: Shogo Tabuchi
Front-end Developer: Tomoya Takahashi (Orunica Inc.)
Sound Designer: Nao Kakimoto
Photographer: Shin Ishikawa
Photographer: Kenichi Aikawa