プロジェクトの相談を申し込む プロジェクト紹介にスキップ

1923. 9. 1. 大邱

大邱医学講習所が最初の扉を開きました

Kyungpook National University School of Medicine 100周年・Webサイトリニューアル提案

記念式の名前を、ホームページの一歩として

「一世紀を歩く」・「命に向けた100年の光」
二つの方向とその過程を込めました

一歩進む
01 / OVERVIEW プロジェクトの概要

1923年の講習所から9,057人の同門まで

Kyungpook National University School of Medicineは1923年に大邱医学講習所から出発し、2023年に開校100周年を迎えました。地方に設立された国内初の国立医科大学として、一世紀にわたって9,057人の同門を育てました。

BlueCanvasは、100周年記念サイトを新たに設計する2つの方向を提案しました。記念式の名をスクロールの一歩に移した「一世紀を歩く」と、ガラスで負った心臓で命に向けた心を描いた「命に向けた100年の光」です。このページでは、2つの提案が出てくるまで、心配した内容とプロセスをまとめました。

CLIENT
Kyungpook National University School of Medicine
KNU School of Medicine
SECTOR
医科大学・開校100周年記念事業
OUR ROLE
リサーチ、ブランド解析、情報構造、
UIデザイン、モーショングラフィック、スクロールフィルム
DELIVERABLE
メイン提案2種、スクロールフィルム2編、
遺物カットアウト8点、カラー・書体ガイド
  • 1923 大邱医学講習所の開所
  • 1002023年、開校100周年
  • 9,057 一世紀にわたって育てられた同窓
  • 2 提案したリニューアル方向
02 / STARTING POINT 出発点

今のメイン画面の設定
  1. 1メニューは4つの束、ページは10個です。
  2. 2最初の画面には、プレスリリースの3つのバナーと3つのバナーがあります。
  3. 3100年の写真と遺物は「History 100>過去100年」の中にあります。

FOUR QUESTIONS

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

  1. Q1
    最初の画面で100年という時間が伝わるでしょうか？

    どちらの提案も、最初の画面をスクロールで再生するフィルムにしました。 A案は心電図の一拍からNEXT 100まで10秒間歩き、B案はガラス心臓に光が回る8秒映像をスクロールに合わせて動かします。

  2. Q2
    サブページにあった写真や遺物を最初の画面に取り出すことができますか？

    年表を横切るシーンをメインページに置き、遺物の八点は背景を消して引き出しから一つずつ取り出すように見せることにしました。

  3. Q3
    イベントが終わった後もまた訪れる理由があるでしょうか？

    過去の行事日程より100周年が残した造形物や記念館、100年史を前に置き、基金募金と資料寄付案内をページの最後まで続けました。

  4. Q4
    同門が携帯で開いても同じ感動が伝わるでしょうか？

    フィルムを縦画面用に別々にレンダリングし、横に渡ったシーンは縦画面の長さと文字サイズに合わせて再整理しました。

03 / VISITORS＆ROUTE 訪問者と同行

イベントが終わった後、
このサイトを開く人は
あなたのクラスだと見ました

記念週間が過ぎるとイベントスケジュールを確認しに来る人は減ります。代わりに、学校の歴史を見直したい同窓会、資金に参加したい寄付者、資料を探している記者のように、長く滞在する訪問者が残ります。訪問者ごとに到着するシーンを先に決めました。

  • 01東門

    記念式典の写真や同窓会のニュースを見て、資金に参加する方法を見つけます。

    記念週間・100Fund
  • 02在学生と教職員

    学校が歩いた道と校正に残った記録を確認してください。

    過去100年・時間の引き出し
  • 03寄付者と後援機関

    資金がどこに使われるのか、参加するとどのような礼儀があるのか​​を調べます。

    100Fund
  • 04メディアとコミュニティ

    プレスリリースやイベント記録、映像素材を探します。

    100周年ニュース

メニュー4つの束を
一度の散歩で

今のサイトは、メニューの4つの束とページ10個に分かれています。 A案はこの内容をメインページ一つに12個のシーンに続き、上から下に下がるだけでも100年の記録を順番に進むようにしました。左側の既存のページが右側のどのシーンに移動したかをラインでした。

100th Anniversary
  • 挨拶
  • プレスリリース
  • ニュースレター
  • 主なイベントと活動
History 100
  • 過去100年
  • 未来100年
100周年記念週間
  • 記念週間
  • 組織構成元のページにリンク
  • スケジュールとプログラム
  • 資料提供
100Fund
  • 資金募金
  1. 01
    一世紀を歩く スクロールで再生される10秒間のフィルム 新しく作成されたシーン
    新しいシーン
  2. 02
    挨拶 一言で明るくなる最初の文 既存の挨拶
  3. 03
    数字で見る慶北医大 100年・9,057人・200億ウォン・2,000編 既存の挨拶
  4. 04
    過去100年 1923年から横に渡る年表 既存の過去100年
  5. 05
    時間の引き出し 背景を消したアーティファクト8点 既存の過去100年
  6. 06
    東仁洞矯正の日 3行に流れる古い写真 既存の過去100年
  7. 07
    100周年記念週間 画面全体に広がる記念式の写真とスケジュール 既存の記念週間・スケジュールとプログラム
  8. 08
    100周年が残ったもの 造形物・記念館・100年史 既存の主なイベントや活動
  9. 09
    次の100年 教育、研究、診療、卒業生 既存の未来100年
  10. 10
    100Fund 募金の目標と預金、支払い方法 既存の資金調達
  11. 11
    100周年ニュース プレスリリース、ニュースレター、主要イベント 既存のプレスリリース、ニュースレター、主要イベントと活動
  12. 12
    資料の寄付 記念館に送信する資料の案内 既存の資料の寄付
04 / BRAND READING ブランドの解釈

新しいシンボルを作成する前に
100年の残りの手がかりを読みました

ロゴを新たに作らず、学校がすでに持っている名前と場所やシンボルでホームページの物語を見つけました。以下の4つの手がかりは、2つの提案の最初の画面と色、動きにそのまま書かれています。

01 · NAME

「一世紀を歩く」

2023年9月2日に開かれた100周年開校記念式の名前です。 A案は歩くという言葉をホームページのスクロールに移しました。下がるほど年が上がり、ページの終わりに近づくと2023年とその後100年に到着します。

02 · PLACE

赤レンガ本館

1933年12月に落成した東仁洞矯正の本館は学校の顔です。 A内のフィルムは本館立面を線で描いた図面が実際の写真に変わる場面を通り、パレットにはレンガ色の色合いが盛り込まれました。

03 · LIFE

心臓と拍動

医学は結局、一人の人生を守ることです。 A案はこの考えを心電図の一拍で描き、B案は光が回るガラス心臓で描きました。どちらの提案も、最初のシーンが命の象徴から始まります。

04 · NEXT

二重らせんと無限

次の100年は研究につながります。 A中のフィルムは「100」が二重螺旋で解けて終わります。 B案はヘッダーの「100」を数字1と無限記号∞を続けて書いた文字に変え、一世紀後にも終わらない時間を表現しました。

05 / ARCHIVE 記録の取り扱い方法

過去100年は実際の記録で、
次の100年は描いたイメージで

両提案の中で守ってきた原則です。学校が公開した昔の写真と遺物の写真はそのまま使い、まだ来ていない未来だけのイメージで新しく描きました。作り出した過去が本物の記録と混ざらないようにするためです。

アーティファクトの写真は、白い背景を消したカットで作り直されました。背景が消えると、サン・ヤンムンと聴診器、ワンジンバッグが画面の上に実際のもののようになり始めました。

白い背景の上で撮影した1940年代聴診器オリジナル写真
背景を消したような聴診器

CUT OUT · 8 OBJECTS

引き出しから取り出したように

中央のバーを左右に動かすと、元の写真と背景を消したカットを比較できます。 8点とも同じように整え、Aの中の「時間の引き出し」で画面の内側から一つずつ近づけました。

  • 8 背景を消した遺物
  • 1928–1970s 遺物の時期
  1. 上楼門
    01 · 1928 商量門 都立大邱議員を新築移転する際に普通病棟に上げた商量門です。
  2. ヨーロッパ製聴診器
    02 · 1940s ヨーロッパ製聴診器 1940年代診療室で患者の呼吸を聞いた聴診器です。
  3. 血圧測定機構
    03 · 1940s 血圧測定機構 木箱に入った1940年代の血圧測定機構です。
  4. 大邱医院卒業証明書
    04 · 1942 大邱医院卒業証明書 1942年大邱医学専門学校が発行した卒業証明書です。
  5. 心電図学講義録
    05 · 1953 心電図学講義録 心臓内科教授が心電図学をまとめた講義録です。
  6. 「大邱医学雑誌」
    06 · 1958 「大邱医学雑誌」 慶北大医大大邱医学会が展開した専門学術誌です。
  7. ワンジンバッグと胎児
    07 · 1970s ワンジンバッグと胎児経 患者の家を訪ねて行った医師のバッグと胎児経です。
  8. ヘッド反射鏡
    08 · ENT 頭反射鏡 耳鼻咽喉科医が額に書いて受診した反射鏡です。
05 / IMAGERY 次の100年のイメージ

人の代わりに
生命の象徴を描きました

未来を見せるシーンには実際の写真はありません。それで、心臓やらせん、神経細胞のように医学が扱う生命の象徴をイメージで描きました。 5枚とも人の顔を入れておらず、赤と金色を両提案のパレットに合わせました。

  1. 赤いガラスのリボンと金色の線でお世話になったハートです。解剖学の絵のように見えないように造形物で描きました。
    01HEARTガラスハート B案・ホーム画面
  2. 赤い光粒子からなる二重らせんです。次の100年の研究を意味します。
    02HELIX二重螺旋 A案・次の100年
  3. 明るい空間に浮かぶガラススパイラル。将来のビジョンの3つのシーンがこの画像の上で変わります。
    03 CRYSTAL クリスタルスパイラル B案・未来ビジョン
  4. 赤く光る神経細胞の網です。研究カードの背景になります。
    04NEURON神経細胞 A案・研究カード
  5. 古い医学の本の上に置かれた聴診器。 100年糸カードの雰囲気を掴んでくれます。
    05STILL LIFE聴診器の静物 A案・100年史カード
06 / COLOR カラーチャート

ロゴの赤の1つから
2つのパレット

100周年ロゴタイプの赤#E60012を目安にしました。画面ではこの赤を広く塗らず、A案はフィルムの闇の上であまり広がらないように少し下げた赤で、B案は心臓と血を思い浮かべる深いクリムゾンに移しました。残りの色は本館のレンガと古い写真、記録紙から選びました。

Logo Red#E60012100周年記念ロゴタイプ
  1. 少し下げるSignal Red#D32D25暗闇の上で広がらない赤・A
  2. 日陰に向かってBrick Shade#8F1F19本館レンガの陰・A案
  3. 青い方にCrimson#A51930心臓と血の赤・B案
東仁洞校正の本館（今）写真
東仁洞校正の本館（今） #623B2F #8F1F19レンガの色合い
本館完成直前(1933) 写真
本館完成直前(1933) #C4AF94 #CFAA6C古い写真の金色
大邱自恵医院はがき写真
大邱自恵議員はがき#DFCBC6 #F3ECE0はがきの紙

写真の中の原色はそのまま書くと濁ったり暗くなり、画面で読み取る明るさと彩度で整えました。矢印の左側は写真の中の灰色、右側は提案に書かれた色です。

A・一世紀を歩く

フィルムの暗闇と記録紙

  • 忙しい・50.2％フィルムが再生される闇の色です。初画面と校正写真、記念週間シーンの背景です。

  • 記録紙・38.5％古いはがきと記録の紙色です。年表と時間の引き出し、ニュースシーンの背景。

  • レンガの色合い・10.3％本館レンガの色合いです。数字と資金シーンに赤い面を敷くときに書き込みます。

  • 昔の写真の金色・0.8％光沢のある写真から選んだ金色です。英文の小タイトルとフィルムのほこり粒子に書き込みます。

  • 心電図の赤・0.3％ロゴの赤を闇の上であまり広がらないように少し下げた色です。年と強調の単語にのみ書いてください。

B・生命に向けた100年の光

夜の心とアイボリー

  • アイボリー・47.2％ページほとんどの背景です。履歴カードと投稿のリストがこの上に置かれます。

  • 砂・27.8％沿革を横切るシーンの土台です。アイボリーより一段暗く捕まえました。

  • クリムソン・13.1％心臓と血を思い出す深い赤です。タイトルの強調単語と進行バー、最後のシーンに書き込みます。

  • 夜・10.3％赤いオーラが回る黒です。心臓が置かれる最初の画面とメニューの背景です。

  • 食べる・1.7％本文の文字の色です。純粋な黒よりも暖かく合わせました。

色見本を押すと、HEX値がコピーされます。見本の中の数字はその上に上げる文字色との明度対比であり、比率は両方の提案のメインページ画面をシーン別にキャプチャして測定した値です。

07 / TYPOGRAPHY フォント

刻まれた文字と
印刷された数字

A中のハングルタイトルは記念碑に刻まれた文字のようにストロークが太いNoto Serif KRで書かれています。年と英文の小タイトルは、19世紀の印刷物で書かれたディドネ様式のBodoni Modaに合わせられ、本文はPretendardで読みやすく置かれました。 B案はPretendardの細いストロークと太いストロークを一つのタイトルの中に備え、年と数字にはGeorgiaを書いた。

Bodoni Moda・A案年度1923

Noto Serif JP · Aのタイトル wght 300

一世紀を歩く

スクロールすると太さが300から900に変わります。 A案は900を書きます。

Pretendard · Bのタイトル 300 · 650

命に向けた
100年の光。

Georgia · B内の数字100→1∞

1001∞

B中ヘッダの「100」は1と∞を続けて書いた文字です。指すと変わります。

Pretendard ·本文400 · 17px

1923年に大邱の小さな講習所で始まった学びは、1世紀にわたって9,057人の同門を育てました。

長い段落は装飾のないゴシック様式で読みやすくした。

08 / FILM＆MOTION フィルムと動き

スクロールが
歩く

どちらの提案も、スクロールをビデオの再生ヘッドのように扱いました。下に下がるとフィルムが前方に流れ、上がると逆さまに巻きます。訪問者が歩く速度に合わせて100年が過ぎます。

Aの最初の画面に書いた10秒のフィルムは、8つのカットでコンティを編み、写真と線画、粒子をコードで描画し、フレームごとにレンダリングしました。

STORYBOARD · 1世紀を歩く · 10秒 24 FPS · 1600×900
  1. 心電図紙の上に鼓動の一つが通り過ぎ、その後1923が浮かび上がる。
    CUT 0100:00.5拍動

    心電図紙の上に鼓動の一つが通り過ぎ、その後1923が浮かび上がる。

  2. 1923年の沿革記録と大邱自恵議員はがきが次々と置かれます。
    CUT 0200:01.9初記録

    1923年の沿革記録と大邱自恵議員はがきが次々と置かれます。

  3. 1933年本館の立面が一画ずつ線で描かれます。
    CUT 0300:03.8線図

    1933年本館の立面が一画ずつ線で描かれます。

  4. 線図の下から1933年の実際の写真が浮かび上がります。
    CUT 0400:04.6写真

    線図の下から1933年の実際の写真が浮かび上がります。

  5. 本館の玄関に入ると、古い写真の間に年が急速に上がります。
    CUT 0500:05.9世代

    本館の玄関に入ると、古い写真の間に年が急速に上がります。

  6. 2023年記念写真に到着します。
    CUT 0600:07.32023

    2023年記念写真に到着します。

  7. 記念式の写真が粒子に散らばって「100」に戻ります。
    CUT 0700:08.7「100」

    記念式の写真が粒子に散らばって「100」に戻ります。

  8. 「100」が二重螺旋で解け、フィルムが終わります。
    CUT 0800:09.9NEXT 100

    「100」が二重螺旋で解け、フィルムが終わります。

A眼フィルムのフレーム：心電図の拍動から二重螺旋まで

このボックスが画面を通過している間は、スクロールに合わせてフレームが移動します。実際の提案は、横型240枚、縦型180枚のフレームを書き、ここでは4枚ごとに1枚を選んで示しています。

A・一世紀を歩く・0:10

心電図の鼓動から始まり、1923年の記録と1933年の本館、昔の写真と2023年の記念式を経て「100」と二重螺旋で終わるフィルムです。

B・生命に向けた100年の光・0:08

ガラスの心周りで光の軌道と粒子が回る映像です。最初の画面では繰り返し再生され、スクロールを開始するとフレームがスクロールに沿って移動します。

  • 横向きの年表

    垂直スクロールは年表を水平方向にスライドさせます。今見ている年の数字だけ赤く塗りつぶします。

  • 奥から来る遺物

    アーティファクトは画面の奥で小さく表示され、前方に近づいた後、横に光ります。

  • 画面全体に広がるウィンドウ

    記念写真は小さなウィンドウで始まり、スクロールに沿って画面全体を埋めます。

  • 一言ずつ明るくなる文章

    長い挨拶は読書のスピードに合わせて1単語ずつ明るくなります。このページの出発点文も同じ方法です。

A案案

A Century of Medicine一世紀を歩く

100周年開校記念式の名前をそのまま持ってスクロールを歩く方向です。最初の画面では、10秒のフィルムがスクロールに沿って再生され、その下に水平年表と時間の引き出し、東仁洞校正の写真、記念週間と100Fundが1ページに続きます。

  • スクロールで再生される10秒フィルム（横型フレーム240枚、縦型180枚）
  • 年が変わるたびに大きな数字が赤く塗りつぶされる水平年表
  • 背景を消した遺物八点が奥から迫る「時間の引き出し」
  • 小さな窓から画面全体に広がる記念週間写真
Noto Serif KR · Bodoni Moda · Pretendard
DIRECTION NOTES

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

  1. 01・線画が写真になる

    1933という数字の下で本館立面が線で描かれ、その上に実際の写真が浮かび上がります。

  2. 01・粒子に集まった100

    2023年記念式の写真が粒子に散らばって赤い「100」に再び集まります。

  3. 02・一言ずつ明るく挨拶

    準備委員会の挨拶の最初の文が読み上げる速度に合わせて、1単語ずつ明るくなります。

  4. 04・横向きの年表

    年が変わるたびに大きな数字が赤く塗りつぶされ、次のカードに進みます。

  5. 05・時間の引き出し

    背景を消した遺物が画面の内側から一つずつ近づき、右側に名前と年が変わります。

  6. 07・画面全体に広がる記念週間

    小さな窓に見える大講堂の写真がスクロールに沿って画面全体に広がります。

  7. 08・積み重ねるカード

    造形物や記念館、100年史カードが順番に重なり、100周年が残ったことを示しています。

  8. 09・次の100年

    赤い二重螺旋上に「次の100年、世界へ向かう医学の拠点」が浮かび上がります。

B案

A Century of Care生命に向けた100年の光

生命を守る心をガラスで作り上げた心臓で描いた方向です。最初の画面の8秒映像がスクロールに沿って動き、1923・1933・1952・2023年を横切る沿革と押して大きく見る記録、教育・研究・世話の3場面に変わる未来ビジョンが続いています。

  • 赤いガラスハートと8秒モーショングラフィック（スクロールに沿ってフレーム移動）
  • スクロールに沿って上から上がる文
  • 四つの時期を横切る沿革と記録拡大窓
  • 教育・研究・思いやりのあるシーンに変わる未来ビジョン
Pretendard · Georgia
DIRECTION NOTES

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

  1. 01・命に向けた100年の光

    赤いガラスの心の隣に最初の文章が置かれます。スクロールすると、画像フレームが一緒に移動します。

  2. 01・一世紀の約束

    心臓が近づいて二番目の文章「一世紀の約束、次世紀の可能性」に変わります。

  3. 02 ・上がる文章

    大きな「100」の横から「時代は変わっても命に向けた心は止まりません」が上から満たされます。

  4. 03・1923年から始まる沿革

    4つの時期の写真と年がスクロールに沿って水平に移動します。

  5. 03・2023、記念造形物

    沿革の最後の章には、校正に建てられたKNU 100 MED造形物が置かれます。

  6. 04・記録カード

    写真とアーティファクトカードを押すと、説明のある拡大ウィンドウが開きます。

  7. 05・三シーンの未来

    水晶螺旋の前で教育、研究、世話をする文章が順番に変わります。

  8. 07 · TOGETHER

    クリムゾンの土台の最後のシーンで資金に参加することをお勧めします。

11 / MOBILE モバイル

手の中でも
同じ一世紀

同窓会のお知らせや基金案内は携帯電話でまず確認することが多いです。 A案はフィルムを縦画面用に別々にレンダリングし、両方の提案とも固定シーンの長さと文字サイズを縦画面に合わせて再設定しました。

A・ファーストスクリーンモバイル画面
A・第一画面
B・ファーストスクリーンモバイル画面
B・第一画面
A・過去100年のモバイル画面
A・過去100年
B・沿革モバイル画面
B・沿革
A・時間の引き出しモバイル画面
A・時間の引き出し
B・未来ビジョンモバイル画面
B・未来ビジョン
A・次の100年のモバイル画面
A・次の100年
B・TOGETHERモバイル画面
B · TOGETHER
COMPARE 2つの方向はどのように異なりますか

同じ100年を示す
二つのステップ

両方の提案は同じ記録を含んでいますが、最初のシーンを開く方法と物語の重さが異なります。学校が100周年サイトで一番最初に伝えたい言葉が何なのかによって選べるように違いをまとめました。

区分A・一世紀を歩くB・命に向けた100年の光
初画面心電図の1拍からNEXT 100まで続く10秒フィルム光が回るガラス心と8秒モーショングラフィック
ストーリーの軸記念式の名「一世紀を歩く」生命に向けた心
色フィルムの暗闇・記録紙・レンガ・心電図の赤・金色夜・アイボリー・砂・クリムゾン
書体Noto Serif JP · Bodoni Moda · PretendardPretendard · Georgia
沿革1923年から10枚のカードに渡す横年表四時を越える横沿革
記録を表示する方法背景を消したアーティファクトが内側から近づく引き出し 写真とアーティファクトカードを押して開く拡大ウィンドウ
次の100年 二重螺旋上の教育・研究・診療・同窓水晶螺旋の前の教育・研究・世話
参加ガイド募金目標と予算、支払方法、資料の寄付資金への参加をお勧めする最後のシーン
重い場所学校の名前と場所、百年の記録医学が守る命と人
THE NEXT CENTURY

機関の100年を、
歩きたい画面に

記念事業は終わっても学校の記録は積もり続けます。ホームページがその記録に初めて会う場所になるよう、機関が持つ名前と場所とシンボルから一緒に読み直します。

プロジェクトを話す他のポートフォリオを見る

その他のプロジェクト

    Contact

    まだ漠然としたアイデアでも構いません。
    プロジェクトを一緒に 整理しましょう

    現在の状況と目標をお聞かせください。 実現可能な範囲、進め方、概算費用をご案内します。

    DIRECT

    opci1004@gmail.com KakaoTalk @bluecvs

    質問4つ・約2分

    ご依頼内容

    どのような作業をご一緒しましょうか。

    複数選べます。まだ決まっていない場合は「その他」を選んでください。

    ご予算

    お考えのご予算はどのくらいですか。

    おおよその範囲でも、ご提案づくりに大いに役立ちます。

    プロジェクト説明

    今の状況をお聞かせください。

    整っていなくても大丈夫です。下の項目を押すと入力の枠が入ります。

    0

    RFPや参考資料を2点までアップロードできます。対応形式：PDF、PPT、Word、Excel、JPG、PNG、ZIP

    ご連絡先

    どちらへご返信しましょうか。

    このサイトはreCAPTCHAによって保護されており、Googleの プライバシーポリシー および 利用規約が適用されます。

    作業範囲・予算・プロジェクト内容・連絡先をご入力ください。