人から始めます。
生活様式と空間のニーズを作品物語の先頭に置きます。結果だけを見るのではなく、選択の理由まで読んでもらいます。
BLUECANVAS SELECTED WORK / 01ARCHITECTURE & INTERIOR
ZIUMN
ブランドウェブサイト
企画・デザイン・開発
01 / THE STARTING POINT どこで始めましたか？
家を見せることより、
家に対する態度を
伝えることがまずでした。
ZIUMNの資料には、異なる家とその家で生きる人々の話がありました。サエホンの伴侶犬のための空間、素材の窓に入れられた風景、風景材の中正まで。作品ごとに選択の理由が異なりました。
ホームページでもその違いが見えなければなりませんでした。一枚の写真を集めるにつれて、この空間がなぜこんなに建てられたのかを読むように構成しました。
完成したホームページにアクセスする344+
素材画像から出発しました
9
作品ごとに異なる話をまとめました
4
異なるデザインの方向を広げました
READ THE SPACE, BEFORE DESIGNING THE PAGE.数百枚の写真から、
数百枚の写真から、
一つの視線で。
外観、生活、光、材料。
イメージを選ぶ基準もブランドの一部です。
02 / BRAND THINKING ブランドの態度を画面の基準として
構築する前に聞くブランド。
表示する前に
理解するウェブサイト。
ブランドの中心は「素敵な建築物」より「そこに住む人」にありました。だから初めての文章も建築の規模や技術を前進するよりも生活の順番から始まります。
既存のブランド名と作品が持つ個性は続き、ウェブでは写真の大きさや文章の口調、余白と動きが同じ態度を伝えるように合わせました。
スペースに集中します。
写真の上の装飾と繰り返されるボックスを取り除きます。風景や光、材料が画面の印象を作るようにします。
次の会話に進みます。
お気に入りの作品からブランドの考えで、作業過程でプロジェクトの問い合わせに自然に移動させます。
THE WORDS THAT GUIDE THE EXPERIENCE
人生が最初に、
空間はそれから。
ブランドの態度→最初の画面の文章 写真より先に決めた、写真を見せる基準
A QUIET PALETTE, A CLEAR POINT OF VIEW.
自然の色を借りて、空間の色を残します。
木と石、壁と紙。
異なるテクスチャが合う色の温度を調べました。
03 / COLOR＆TYPOGRAPHY 写真を際立たせるビジュアルルール
画面の色が
作品よりも前にならないように。
濃いオリーブは写真の光をシャープにし、セージは視線が休んでいく区間を作ります。長い文章は柔らかい白の上に置いた。色が変わる地点は、物語の場面が変わる地点でもあります。
写真を支える深さ
作品写真のコントラストを活かし、シーン間の切り替えをじっくりと支えます。
自然とつながる色
文章と線に書く緑。風景と庭園を一緒に考えるブランドの態度に触れます。
視線が休む面
線画と空間の物語を示す背景。暗い写真シーンの間に明るさを追加します。
読むための余白
作品の説明と長い文章が置かれる色です。純白よりもスムーズに写真につながります。
TYPE EXPLORATION
同じ文章も、書体によって異なって聞こえます。
ミョンジョは1つの物語を読む印象を、サンセリフは空間をはっきりと示す印象を作ります。確定案は大きなサンセリフのタイトルを中心に、補助英文にイタリックの柔らかさを加えました。
SANS/確定案の中心
人生を盛り込む空間。
形ははっきり、文章は淡白に。SERIF / 編集提案
人生を盛り込む空間。
ゆっくり読まれるタイトルと広い余白。EDITORIAL / 補助英語
A life, well framed.
04 / DESIGN EXPLORATION 同じブランド、4つのアプローチ
一度に描いた正解よりも、
異なる可能性があります。
写真に没頭する方法、雑誌のように読む方法、モデルと光で始まる方法、情報と作品を構造化する方法。同じ資料を置いても第一印象と読む速度は変わります。
以下の提案は実際に作成した画面です。各方向が何を強調しているかを比較し、提案を直接開き、動きまで見てください。
01 / Cinematic 確認提案
空間に入る第一印象
実際の家の写真を大きく開き、スクロールに応じて外から内部に視線を移動します。 ZIUMNが建てた空間をまず体験させる方向です。
大胆なサンセリフ/オリーブ/写真中心提案を直接表示02 / Editorial 提案を見る
一冊の建築誌のように
明朝のタイトルや紙のような背景、余裕のある余白で作品をゆっくり読みます。写真の横に物語をつけて落ち着いた印象を生かしました。
明朝/ワームアイボリー/非対称編集提案を直接表示03 / Spatial 提案を見る
時間と光で説明する建築
建築モデルと一日の光を最初のシーンにしました。実際の作品を紹介する前に、思考が空間に変わる過程を視覚的に見せる方向です。
大きな明るさ/ニュートラル/時間の切り替え提案を直接表示04 / Structured 提案を見る
哲学と作品を一つの体系に
ZIUM&表記と幾何学的な線、作品カードと段階的な説明を組み合わせました。ブランド哲学から作業過程まで順番に理解させる方向です。
サンセリフ/セージ/幾何学的構造提案を直接表示THE CHOSEN DIRECTION / CINEMATIC
結局、ZIUMNが建てた空間を最初に会わせました。
確定した1番提案では、実際の作品写真が第一印象を作ります。大きなタイトルはブランドの態度を短く伝え、スクロールはスペースの外側から内側につながります。他の提案の中でサルピンの物語や情報も作品紹介や作業過程の中で続きます。
実際の作品が最初のシーンに 短くて明確なブランド文 説明になる動き
05 / INTERACTION WITH A REASON外から中。
外から中。
見る人から、滞在する人へ。
写真が大きくなり、視線が中に移動します。
OUTSIDEINSIDE
06 / THE DIGITAL EXPERIENCE 移動した後は、読む情報
写真に滞在したら、
今理由を読んでください。
最初の画面の没入が次のページでも続くように作品、ブランド紹介、一緒に造る過程、材料とディテール、お問い合わせをつなげました。作品を鑑賞した人が自分のプロジェクトを思い出せる順番です。
- 01 空間に会う 実際の作品と第一印象
- 02 態度を理解する 作品の物語と哲学
- 03 プロセスを調べる 家畜と材料の選択
- 04 会話を開始する プロジェクトのお問い合わせ
住宅、インテリア、商業空間を区分し、作品別の物語を詳細ページにつなげます。
家の外、壁の中、屋内に資材を分けて、何を考慮するのかを理解させます。
EVERY SPACE HAS A DIFFERENT REASON.同じ枠内でも、
同じ枠内でも、
作品の表情は違う。
サエホン
一緒に暮らす皆のための家
両方の建築主とペット犬の生活が窓、庭、空間の構成を決定します。
素材
風景を含む白い家
窓の位置と比率、空間ごとに異なる図形が家の話になります。
風景素材
風景と日常の間の中正
庭やデッキ、夜の光まで1つの生活シーンで見せてくれます。
月光酒店
記憶の中の路地を空間に
住宅や他の商業空間の雰囲気も同じブランドの中でつながります。
07 / IN YOUR HANDS モバイルでは、モバイルの速度で
小さな画面でも
空間は寛大に。
パソコンの横展開を小さな画面にそのまま縮小しませんでした。作品は縦につながり、文章は読める大きさで残ります。片手で作品や物語を見て次のページに移動できるようにしました。
大きな写真と読む本文 垂直につながる作品を探す 指で開くメニューと写真を拡大 デバイスの動作を減らす設定を反映
08 / MEET THE WEBSITE 今すぐ自分で体験してください。
説明した選択肢が
一つのウェブサイトに。
第一印象から作品を読む順番、色と動きまで。 ZIUMNのホームページからひとつにつながります。
ZIUMNホームページにアクセスziumn.com
YOUR BRAND, SEEN WITH CARE.あなたのブランドには
あなたのブランドには
どのような理由がありますか？
持っている写真、まだまとめていない話、悩んでいる方向まで一緒に見てみましょう。
ZIUMN / BRAND WEBSITE Planning · Design · Interaction · Development BLUECANVAS