HANSAE YES24 FOUNDATIONWEBSITE RENEWAL PROPOSAL

一本の糸、一枚の本

Hansae YES24 FoundationWebサイトリニューアル提案
Beyond Borders · 1オールの糸、2つの方向

BLUECANVAS YES24 ·本 2026

HANSAE YES24 FOUNDATION · CASE STUDYHansae YES24 Foundation ホームページリニューアル提案
スクロールすると金糸が布を織り開始します

THREAD・ハンセ服を作るHansae Co.の名前で
本物のオールを見つけました

SINCE 2014 Hansae Co.の成長を伴うASEAN諸国と
文化へのつながりのために財団が発足しました

PAGE · YES24本を売るYES24の名前で
本1枚を見つけました

ケースを読む

01 / OVERVIEWプロジェクト概要

韓国とASEANを
文化につなぐ財団

Hansae YES24 Foundationは、Hansae YES24ホールディングスキム・ドンニョン会長が社材を出演し、2014年4月に発足した公益財団です。財団の姿であるHansae Co.が東南アジアで成し遂げた成長をもとに、国際文化交流展を開き、東南アジア文学総書を展開し、韓国とASEANの間に文化の道を置いてきました。人文学研究と奨学事業、義堂愛分かち合い、2024年に始まった歌曲公演韓世クラシックLiedも財団の仕事です。

BlueCanvasは今の財団ホームページを作って管理してきたし、2025年「タイ現代美術：夢と私有」展示では作品の横QRコードで開くオーディオガイドページ25個を作りました。今回は、財団が積み重ねてきたことを最初の画面で見せるようにメインページを新たに設計し、Beyond Bordersと1オールの糸という2つの方向を提案しました。

CLIENT: Hansae YES24 Foundation
2014年に発足した公益財団
SECTOR: アセアン文化交流・人文学研究支援
奨学・医学スポンサー・クラシック公演
OUR ROLE: リサーチ、ブランド解析、情報構造、
UIデザイン、モーショングラフィック、スクロールフィルム
DELIVERABLE: メイン提案2種、モバイル画面、
スクロールフィルム、カラー・書体ガイド

2014 財団の発足 2014年4月、Hansae YES24ホールディングスキム・ドンニョン会長が私財を出演した公益財団
7 回 国際文化交流展 2015年から東南アジア6カ国の美術をソウルに紹介
7 冊 東南アジア文学総書 東南アジア小説を韓国語に移した総書
39回党奨学会授与1988年から続いてきた奨学事業

02 / CHALLENGE出発点

、

財団紹介・財団事業・財団ニュース

Towards a Sustainable Cultural Future韓国とアセアン、文化交流で共に開く持続可能な世界

財団事業

ASEAN文化交流 人文未来の成長 真の愛の共有 ハンセクラシックLied

SNS

財団ニュース

123

今ホームページのメイン画面構成

1展示写真スライドの上に、ビジョン文の1行が置かれます。
2ビジネスカード4枚が同じサイズに置かれ、展示や本、公演はカード内メニューにあります。
3 SNSネカンとお知らせのリストが続きます。公募のニュースをすばやく見つけるのに最適な構成です。

FOUR QUESTIONS

リニューアルは
4つの質問で始まりました

今、ホームページはお知らせと申請案内をすばやく見つけるようにした仕組みです。その間、財団の仕事は展示や本、公演に広がりました。

Q1
最初の画面で財団がすることが見えますか？
今は写真スライドの上にビジョン文の一行が置かれています。両方の提案は、最初の画面で財団がすることを一文で言います。
Q2
7回の展示と7冊の本はどこに置きますか？
B案は展示を年度順につなぐ横シーンと七冊が回る書家を別々に作り、A案は4つの名刺と文化物語の中に収めました。
Q3
公募期間中に何が最初に見られるべきですか？
公募案内と選定発表は応募者が待っているニュースです。どちらの提案も、お知らせを最初の画面の下のリストに置き、A案はお知らせと文化ニュースを分けてみました。
Q4
展示、文学、奨学、音楽が一流で読まれますか？
A案は「文化を分ける4つの方法」で、B案は実は今年が展示と本、舞台を順番に通り過ぎるフィルムで4つの事業を結びました。

03 / NAME名前をもう一度読む

Hansae YES24という名前に
部屋と本がありました

新しいシンボルを作成する前に、今の名前とロゴをもう一度読みました。一つの言葉のように付いているHANSAEとYES24、そして二つの名前を分けた二つの青で二つの提案の出発点を見つけました。

01 · TWO NAMES

名前のある2社

財団の名前はHansae YES24ホールディングスから来ました。その名の中には、服を作るハンサエ株式会社と本を売るYES24が並んでいます。ホームページを再構築する前に、これら2つの名前からもう一度読みました。

02 · TWO BLUES

2つの異なる青

ロゴの色を抜いてみると、HANSAEは濃い藍色＃17478E、YES24は明るい青＃007DC3です。一つの言葉のように貼り付けたが、色では二つの名前が分かれる。

03 · THREAD

ハンセの糸

財団の姿であるHansae Co.は服を作る会社であり、東南アジアで事業を展開して成長しました。財団はその国々と文化にさらに深く交流しようと発足し、2016年にはインドネシアの生地バティックで展示を開きました。私たちはこの名前から本当のオールを思い出しました。

04 · PAGE

YES24の本

YES24は本を売る会社です。財団は東南アジア小説を韓国語に移し、七冊の総書で展開し、財団事業参加者とグループ役員が書く電子図書館も運営します。私たちはこの名前から本の一枚を思い出しました。

05 · TWO OPENINGS

両方の提案の最初の文

B案したオールの実は「実一オールで始まった縁」で、A案Beyond Bordersは「一枚の本で始まった出会い」で初画面を開きます。同じ財団を室から出発して読んだ提案と本から出発して読んだ提案です。

04 / RECORD13年の記録

13年の記録を
6本鎖にまとめると

公式ホームページ沿革に載せられた87件を仕事の種類に応じて六本鎖の糸に分けました。縦線は一年で、結び目一つが記録一つです。

財団5
展示・交流9
本・文学11
奨学金・人文43
議堂17
音楽2

2014年2月 創立理事会

2014 → 2024初年度に財団設立と奨学の2本だった記録が2024年に音楽が加わり、6本鎖となりました。
2020 - 2022 3年間、展示会は開かれず、その間に本の記録が5回続きました。
2014 – 2025奨学と人文交流の実は、最初の年から2025年まで一年も途絶えませんでした。

05 / MAP6つの国からソウルへ

6つの国の芸術が
ソウルに来ました

国際文化交流展は、東南アジア各国の作家と作品を韓国に紹介する展示です。 2015年にベトナムを皮切りに、6カ国の作家と一緒にいたし、公式ホームページに名前が載った作家だけ92人です。展示が開かれた順に各国からソウルまで糸をつなぎました。

2015 1 / 7 ·ベトナム

《ベトナムのオーラ》

2015. 7. 16.~7. 20. ・ソウルインサアートセンター

作家14人

2016 2 / 7 ·インドネシア

《バティック、インドネシアの魂》

2016. 6. 22.~6. 27. ・ソウルインサアートセンター

作家4人とバティックワールドデザイン優勝者

2017 3 / 7 ·タイ

《The Spirit of Thailand》

2017. 7. 12.~7. 18. ・ソウルインサアートセンター

作家19人

2018 4 / 7 ·ミャンマー

《笑顔の土地ミャンマー、関係の美学を育てる》

2018. 9. 12.~9. 17. ・ソウルインサアートセンター

作家8人

2019 5 / 7 ·フィリピン

《フィリピン美術、その多様性とダイナミズム》

2019. 9. 4.~9. 9. ・ソウルインサアートセンター

作家11人

2023 6 / 7 ·マレーシア

《マレーシアを抱く》

2023. 3. 8.~3. 13. ・ソウルインサアートセンター

作家12人

2025 7 / 7 ·タイ

《タイ現代美術：夢と私有》

2025. 4. 5.~4. 20. ・芸術の殿堂ハンガラム美術館

作家24人

1・ベトナム
2・インドネシア
3・タイ
4・フィリピン
5・フィリピン
6・フィリピン
7・インドネシア

BOOKS 東南アジア文学総書

本も同じ道に来ました

東南アジア文学総書7冊はベトナム1冊、インドネシア2冊、タイ1冊、フィリピン3冊です。地図の細い糸は本の長さで、太いほど本が多いです。

06 / STRUCTURE訪問者とシーンの順序

財団のホームページを開く
五種類の人々

財団ホームページには奨学金と研究支援に支援しようとする人、展示や公演を見に来る人、本を探す読者と研究者、記者、スポンサーが一緒に訪れます。訪れる人ごとに確認したい情報が異なり、それぞれが到着する場面を先に決めました。

01支援事業志願者
グローバルフェローシップと人文学研究支援事業の公募日程、申請方法、選定発表を確認します。
財団ニュース・申請
02展示・公演観覧客
次の展示とパフォーマンス、最後の展示の記録を探します。
国際文化交流展 · Lied
03読者と研究者
東南アジア文学総書と発刊資料、研究資料を探します。
文学総書・資料室
04記者と文化芸術界
財団紹介や歩いてきた道、プレスリリースを確認します。
財団紹介・沿革
05スポンサーとグループ役員
後援方法と寄付金活用履歴、電子図書館を探します。
スポンサー・電子図書館

4つの事業を
一つの流れとして読む

どちらの提案も、最初のシーンで財団を1つの文章で紹介し、ビジネスと物語を通り過ぎて最後に一緒に行く途中にあります。 A案は6シーンで軽くすっきりさせ、B案は展示と本、音楽にシーンを一つずつ与えて、9シーンで長く歩ませました。色点は、各シーンが示すものです。

紹介
4つの事業
展示
本
音楽
文化ストーリー
ニュース・公募
スポンサー・一緒に

A · Beyond Borders6シーン

01文化で開いて、人につながるアーチ内の展示場が画面全体に広がる最初の画面
02OUR BELIEF一つの単語がつく財団の信念 · Since 2014
03WHAT WE DO4つのビジネスを横断するカード
04CULTURE JOURNAL『シガレットガール』と冬の物語
05LATEST UPDATESお知らせと文化ニュースを共有するリスト
06LET’S CONNECT財団と一緒にする

B・1オールの糸9シーン

01韓国とASEAN、文化につながります実際の今年の5章フィルム
02財団紹介 · 数字設立の趣旨と数字の5つ
03財団事業4つの事業が1枚ずつ重なるシーン
04国際文化交流展7つの展示を結ぶ横糸
05東南アジア文学総書七冊が円を描いて回る書が
06ハンセクラシックLied文字の中で開催される会場
07財団が歩いた道 2014年から2026年までの年度
08財団ニュースお知らせリストとSNS
09スポンサー一緒に企業と電子図書館

07 / COLORカラーチャート

ロゴの2つの青から
紙と糸へ

ロゴはHANSAEを濃い藍色で、YES24を明るい青で撮りました。 B案は韓世の藍色を夜空まで引き下げて側光の背景を作り、A案は青をロゴにのみ残し、背景を本棚の紙色に変えました。

HANSAE#17478E

RGB 23 71142 ・濃い藍色

→B内側の光Night #060B1A

YES24#007DC3

RGB 0125195 ・明るい青

→ A 内紙 Paper #F3F1E9

A案の最初の絵：本棚が折り畳まれてアーチをなした紙本の扉とその向こう東南アジアの島、コーラルライト海とエメラルド水 — **A・紙の色** Aの最初の絵は、本棚がアーチを形成した紙のドアでした。ドアを越えて東南アジアの島と海が見えました。紙と水、リボンから画面の3色を選びました。

B・糸の色側染色は韓国にも、バティックやイコットのような東南アジア生地にもある古い藍色です。 B案はこちらの光をもとに敷き、禁じられたオールマンを通り過ぎました。上の見本はBの中の色で織られた平織りです。

紙の材料と糸の材料

A案は朝日光のかかる机を思い出しました。アイボリー紙の上にエメラルド布で安い本とコーラルリボン、花びら八枚の紙の花を上げました。

B案はランタン一つだけつけた夜の作業台を思い出しました。側光布の上に金糸失敗とバティック布、蜜蝋を描く道具編みを置いた。真ん中の線を左右にドラッグすると、両方の材料に耐えることができます。

A の Beyond Borders の材料板: アイボリーのペーパー、エメラルド色の布の壮大な本、コーラルリボンおよび花びら 8 枚の紙の花

Bなしのオールスレッドの材料ボード：サイドライトクロスの上に置かれた金の失敗とバティック布、バティックツール編み物、金箔本

A · Beyond Borders

紙の部屋

忙しい・53％漢紙より少し暖かい紙色です。白ではなく、写真や文章が紙の上に印刷されているように見えました。
文字・ビジネスシーン・18％本文と「4つの方法」シーンの基礎です。黒の代わりに深い緑色をモックで書いた。
強調・最後のシーン・21%ピリオドと「つながると」、ビジネスカードと最後のシーンの色です。
線・2％章を分ける細い線の色です。
人文未来成長カード・1％第2名刺の背景です。
擬似愛分けカード・5％第3名刺の背景です。

B・ワンオールの糸

部屋の部屋

忙しい・63％側光布を夜空まで引き下げた色です。最初の画面のフィルムがページ全体につながるように、最も暗くした。
シーン・26％展示と書家、ニュースシーンの背景です。
カード・7％カードと境界の色です。
室・強調・1％未満禁室と年度、スポンサーボタンの色です。画面の1％にもなりませんが、目は最初にこの色になります。
光・1％未満糸に光が当たった部分の色です。
文字・2％暗い背景の上の本文の色です。

色見本を押すと、HEX値がコピーされます。見本の中の数字はその上に上がる文字色との明度対比であり、比率は両提案の場面キャプチャで各色に近い画素を数えた値です。

08 / TYPOGRAPHY書体

本の文字と
部屋の文字

A案はハングルのタイトルをPretendard 500で軽く書き、英語の1、2単語だけをInstrument Serifイタリックに変え、手書きのようなリズムを与えます。数字はDM Sansで大幅に書き込みます。

B案はハングルのタイトルに筆の結び目が残ったマルブリを書き、英文はCormorant Garamondイタリックに合わせました。本文はどちらの提案もPretendardです。

Instrument Serif Italic · Aの最初の画面 Beyond

Beyond borders.

韓国とASEAN、
文化につながります

MaruBuri 600 · Bの最初の画面 ハングルタイトル

Pretendard 500 · Aのタイトル 500 / -0.06em

文化で開き、
人につながる。

私たちは文化が人と人を引き継ぐと信じています。

DM Sans · A内の数字 400

Since 2014↗

Four ways to connect.

Cormorant Garamond · B案英語 Italic 500

Towards a Sustainable Cultural Future

持続可能な文化の明日

09 / MOTIONモーション原則

本棚を渡るように、
部屋に沿って行くように

Aの中の動きは本を広げる手の速度を、Bの中の動きは糸が布を通る速度に従います。両方ともスクロールが動きを導き、オペレーティングシステムでモーションを減らすと、最後のシーンだけが表示されます。下の4枚のカードは実際にスクロールに沿って移動します。

01 · ARCH TO SCREEN · A

アーチが画面になる瞬間

A内の最初の画面のアーチはスクロールに沿って角が広がり、画面全体に広がります。このカードのアーチも通り過ぎる間、同じように開きます。

02 · THREAD FILM · B

糸に沿ったフィルム

Bの最初のシーンは、237枚のフレームをスクロール位置に合わせて描画します。このカードを通る間、そのうち60枚が同じように進みます。

03 · WORD BY WORD · A

一言ずつ点灯する信仰

A案の紹介文はスクロールに沿って灰色の文字が一単語ずつ濃くなり、横の紙の花が一緒に助けます。このカードの文章や花も同じように動きます。

04 · ONE LINE · B

展示を縫う一本鎖

B案は7回の展示ポスターを禁じられたストランドの上に掛け、縦スクロールを横移動に変えて糸に沿って歩くようにします。このカードの糸とポスターもスクロールに沿って流れます。

A案案・紙

Beyond Borders文化で開き、人につながる

本一枚を広げるように明るく開く方向です。最初の画面のアーチの中で、2人の作品が一緒に見えます。スクロールを下げると、アーチが画面全体に広がり、8秒の映像がスクロールに沿って前後に移動します。 4つのビジネスは横向きのカードで、文化の物語とニュースはその下に順番に置かれました。

アーチが画面全体に広がる最初の画面とスクロールに沿って動く8秒映像
一言ずつ点灯する財団紹介文とゆっくり回る紙の花
「文化を分ける4つの方法」水平カード
お知らせと文化ニュースを分かち合うリスト、画面内のモーションを減らすボタン

Pretendard · DM Sans · Instrument Serif

DIRECTION NOTES

提案Ａのシーンの中で演出にボールを入れた瞬間を選びました。写真をタップすると、シーン別画面を大きく見ることができます。

文化で開き、人でつながる。
最初の画面のアーチの中で、2人の作品が一緒に見えます。以下は、Beyond bordersを大きく書いた。
アーチが画面になるまで
スクロールすると、アーチが画面全体に広がり、その上に「互いに違う文化、一つの明日」が浮かび上がります。
一言ずつ点灯する信仰
灰色の文字がスクロールに沿って一つの単語ずつ濃くなり、「続けてくれる」だけがコーラルに変わります。
Four ways to connect.
文化を分ける4つの方法を水平に渡すカードで示しています。最初のカードはASEAN文化交流です。
カードごとに異なる背景
人文未来成長はセージ、義堂愛分けはピンク色です。事業ごとに色を一つずつ決めました。
心に響く
4枚目のカードはハンセクラシックLiedです。会場の木色をカードベースに移した。
私たちの間に、文化があります
文化物語では『シガレットガール』と冬ナグネを大きさを違って並べておきました。
一緒に開く文化
最後のシーンは、コーラルの背景にLet’s connect.を大きく敷いて財団と一緒にする道で案内します。

BEYOND BORDERS本棚を覆う

一年の部屋部屋に沿って夜に行きます

B案案・糸

韓国の部屋韓国とASEAN、文化につながる

夜の側光布の上に禁じられたオールが通り過ぎる方向です。スクロールすると、糸はバティックの模様や展示場、開いた本や会場のピアノを順番に通り、海の上の地平線に触れます。財団の5シーンを糸一本につなげたスクロールフィルムです。

糸・展示・文学・音楽・明日をつなぐ5章スクロールフィルム
七回の展示を行ったストランドの上に年度順に掛ける横シーン
7冊が円を描いて回る書家とLied文字の中で開かれる会場
2014年から2026年までの年度と財団のニュース

MaruBuri · Cormorant Garamond · Pretendard

DIRECTION NOTES

B案のシーンの中で演出にボールを入れた瞬間を選びました。写真をタップすると、シーン別画面を大きく見ることができます。

韓国とASEAN、文化につながる
側光布の上に禁じられたオールが通る最初のシーンです。スレッドは画面の右側に流れ、次のシーンにつながります。
七回の展示、六国の作家たち
糸がバティック模様を通り過ぎ、展示場の吊り場の前に入ります。チャプターごとに短い文が一枚ずつ変わります。
市と旋律が出会う舞台
本を過ぎると、会場のピアノが出てきます。金糸はピアノの上で旋律のように反ります。
糸の上に置いた数字
2014年の発足と展示7回、総書7冊、奨学事業の数字を糸一本に散らばりました。
7回の展示
展示ポスターを載せたストランドの上に年順に歩きました。垂直スクロールが水平移動に変わります。
道を立てる
総書7冊が円を描いて回り、前に来た本の紹介が左から変わります。
Lied
Lied 4文字の中に会場が見え、スクロールすると、文字が大きくなり、会場が開きます。
財団が歩いた道
左側の大きな年はスクロールに沿って2014から2026に進みます。

10 / PROCESS最初の図からフィルムまで

想像の中の風景の代わりに
展示会場の1つのシーン

A案の最初の絵は本棚が折り畳まれてアーチをなした紙扉でした。内部レビューでは、財団の仕事は、想像の中の風景よりも展示場で実際に起こる出会いに近いという意見が出て、最初の画面を作品を一緒に見る二人の場面に変えました。アーチの形と絵から選んだ3つの色はそのまま残りました。

6つのシーンが本当のオールでした。

B案の最初のシーンのために、糸、バティック、展示、本、音楽、明日を意味する6シーンを先に描きました。前のシーンの最後と次のシーンの初めが合うように構図を合わせ、禁じられたオールがすべてのシーンを通り過ぎた後、5つの映像であった。

01 糸サイドライトの布の上に禁じられたオールが通過します。
02 バティック 糸は金色の蓮の花の間に入ります。
03 展示吊り下げられた展示場の床に糸が流れます。
04 本ランタンの下に広がる本の上に糸が通っています。
05 音楽会場のピアノの上で、糸は旋律のように曲がります。
06 明日海の上の地平線から糸が明るくなります。

B・一オールの糸・16:9・0:25

禁じられたオールが糸、バティック、展示、書籍、音楽を通って地平線に触れるフィルムです。提案では、このフィルムをスクロール位置に合わせて前後に移動します。

A · Beyond Borders · 3:2 · 0:07

展示場シーンにカメラの動きと微細な光の変化を加えた映像です。提案では、アーチが広がっている間スクロールに沿って移動します。

11 / MOBILEモバイル

手の中でも
同じ紙と糸

公募ニュースや公演案内は携帯電話で確認することが多いです。 A案は、モバイルでアーチの最初の画面を縦の割合で取り戻し、横に渡った4つの事業を縦に積み上げました。 B案は縦画面専用フレーム237枚でフィルムを別々に作りました。

COMPARE2つの方向はどう違いますか？

同じ財団を開く
紙と糸

両方の提案は同じ内容を含んでいますが、最初の画面で最初に言うことが異なります。 A案は明るい紙の上で財団の事業をすばやく盗み、B案は実一本鎖に沿って財団が積み重ねてきた記録の中に深く入るようにします。財団が最初の画面で最初に伝えたいシーンに合わせて選べるように違いをまとめました。

区分A · Beyond BordersB · 一本の糸

初画面アーチ内の展示場シーンが画面全体に広がり、8秒映像がスクロールに沿って動き実したオールがバティック、展示場、本、ピアノ、地平線を通る5章フィルム

色アイボリー・エメラルド・コーラルサイドライト・ゴールド

書体Pretendard · DM Sans · Instrument SerifMaruBuri · Cormorant Garamond · Pretendard

事業を見せる方法「文化を分ける4つの方法」

展示と本ビジネスカードと文化物語の中で紹介七回の展示をつなぐ横糸と七冊が回る書家

音楽文化物語のウィンターナグネカードLied 文字の中に開かれる会場

ニュースお知らせ・文化ニュースに分けて見るリストお知らせリストとSNSカード

重い場所軽い第一印象とクイックナビゲーション積み重ねた記録と没入感

12 / CREDITSBLUECANVAS · WORKS 2026

WOVEN LABEL