森山海莉/情報デザイン研究I をテンプレートにして作成

開始行:
*色と幾何学のコンポジション ワシリー・カンディンスキーの作品を分析し、構築したインタ... #image(MV3.jpg) -''森山海莉'' -'''Keywords：Geometry, Color, Kandinsky, Synesthesia''' -[[著書調査>https://design.kyusan-u.ac.jp/socialdesign/?%... -[[絵画分析>https://design.kyusan-u.ac.jp/socialdesign/?%... -[[応用可能な設計要素>https://design.kyusan-u.ac.jp/socia... -[[分析ドローイング集>https://ksumail-my.sharepoint.com/:... //-[[発表用スライド>https://ksumail-my.sharepoint.com/:p:... //-https://www.example.com //-__[[相互評価シート>https://www.example.com]]__ ← ここ... ~ //***CONTENTS //#contents2_1 //~ **概要 ***これは何？ Webのスクロールを時間軸として活用することで、カンディンス... //&color(red){これは何か・・を簡潔に}; ~ ***背景と目的 美術館でワシリー・カンディンスキーの作品を鑑賞した際、他... 現在のWebデザインでは、機能性や可読性を重視した表現が主流... //&color(red){プロジェクトの背景と目的}; ~ ***コンセプト 本研究では、ワシリー・カンディンスキーの作品を色彩・形態... さらに、その造形原理をスクロール(いわゆる時間軸)と組み合... //&color(red){基本的な考え方、枠組み、視点など}; ~ ***成果物の仕様 webサイト //&color(red){&small(成果物の形式・サイズ・時間尺等);}; ~ ***制作ツール -figma -Illustrator -Procreate -VScode -claude(補助として活用してみる) //&color(red){使用するツール｜ハードウエア・ソフトウエア}; ~ ***プロジェクトの期間 2026.04.09~ //&color(red){プロジェクトの期間｜20XX.XX.XX - 20XX.XX.XX... ~ ***まとめ 本研究では、カンディンスキーの著書や作品分析、ドローイン... //&color(red){プロジェクトが完結したら「まとめ」を記載し... ~ ~ **調査 ***現状調査 -Webデザインでは機能性や可読性が重視され、芸術理論の応用... --バウハウスの影響を受けたWebデザインは多いが、その多くは... --[[バウハウス創立100周年を記念して制作された公式プロジェ... --[[ドイツのプロダクトデザイナー、ディーター・ラムスがデ... --[[「Bauhaus」をテーマにした受賞Webサイトをまとめたギャ... -- -カンディンスキーの造形理論や運動性をインタラクティブに応... --[[画面をマウスでドラッグすると、システムがそれを自動認... --[[代表作『黄・赤・青』を「触れる音楽インストゥルメント... //&color(red){プロジェクトのテーマに関わる社会の現状と問... ~ ***先行事例 先行事例として、カンディンスキー自身が幾何学の力に着目し... またカンディンスキーは「絵画を音楽のような芸術にしたい」... ~ -カンディンスキー自身の著書 --[[点と線から面へ>https://www.chikumashobo.co.jp/product... --カンディンスキーの作品は、なぜ画面から音が聴こえてくる... --[[著書の内容をまとめたもの>https://design.kyusan-u.ac.j... -カンディンスキーの共感覚 --カンディンスキーは「色や形を音として聴き、音を色として... --[[共感覚について>https://artsandculture.google.com/stor... --[[カンディンスキーが提唱した「共感覚」を、誰もが直感的... ~ -インタラクティブサイト --[[キャンバスに描いた幾何学図形がそのまま音に変換される... --[[PCのキーボードを叩いたり、マウスを動かしたりすると幾... --[[スクロールするとセクションごとに図形や色彩の切り替わ... -p5.js --Webブラウザ上で数行のコードを書くだけで、簡単にグラフィ... --[[世界中のコーダーがp5.jsで作った作品を投稿している最大... ~ -影響を受けた音楽家 --リヒャルト・ワーグナー ---カンディンスキーが若い頃にオペラ ローエングリンを鑑賞... ---後に、「音楽を聴いている最中、私の目の前に、モスクワの... ---[[ローエングリン」第3幕への前奏曲>https://youtu.be/29d... --アルノルト・シェーンベルク ---カンディンスキーに最も思想的な影響を与えた音楽家。1911... ---当時のシェーンベルクは、従来のクラシック音楽のルール（... ---[[3つのピアノ曲 作品11（Drei Klavierstücke Op.11）>htt... ---これまでのクラシック音楽にあった「ハ長調」や「ト短調」... ---[[弦楽四重奏曲 第2番 嬰へ短調 作品10（Streichquartett ... ---弦楽四重奏（ヴァイオリン2、ヴィオラ、チェロ）に、「ソ... ~ ***技法・技術情報 //&color(red){プロジェクトの遂行に必要な技法・技術に関す... ~ ~ **プロジェクト管理 ***スケジュール [[スプレッドシート>https://docs.google.com/spreadsheets/d... //&color(red){計画的な遂行のために、進行管理表を作成して... ~ ***ToDo ① 調査・分析 目的：カンディンスキーの造形理論とWeb表現の特徴を理解し、... %%-インタラクティブWebサイトの調査%% %%-スクロール演出を用いたWebサイトの調査%% %%-カンディンスキーの著書（『点・線・面』など）の読解%% %%-カンディンスキー作品の分析（点・線・面・色彩・構図・リ... %%- Webデザインへ応用可能なデザイン原理の抽出%% ────────────────── ② ドローイング・スケッチ 目的：抽出した造形原理を理解・再構成し、スクロールによる... -カンディンスキー作品の分解スケッチ（点・線・面・構図） -造形要素を組み替えた再構成ドローイング -スクロールによる図形変化のアイデアスケッチ -スクロールごとの画面遷移（絵コンテ）の作成 - Webで使用する図形・モチーフの選定 ────────────────── ③ コンセプト・情報設計 目的：サイト全体の体験と構成を設計する。 -サイトコンセプトの策定 -ユーザー体験（UX）の設計 -サイトマップの作成 -ワイヤーフレームの作成 - スクロールフローの設計 -各セクションの役割整理 ───────────────── ④ ビジュアル・インタラクション設計 目的：カンディンスキーの理論を反映したWebデザインを具体化... -配色設計 -タイポグラフィ選定 -レイアウト設計 -図形・アニメーション設計 -スクロールと図形変化の対応関係の整理 -プロトタイプ作成 ────────────────── ⑤ 実装 目的：設計内容をWeb上で実現する。 -HTML構築 -CSSデザイン -スクロールアニメーションの実装 -レスポンシブ対応 -パフォーマンス調整 ────────────────── ⑥ 評価・改善 目的：制作物が研究目的を満たしているかを検証する。 -動作確認 -ユーザーテスト -改善点の抽出 -デザイン・実装の修正 -最終成果物の完成 //&color(red){やるべきこと（タスク）を箇条書きにします。}; //&color(red){完了後は「%%取り消し線%%」あるいは「// コメ... //***NotToDo //&color(red){やらないこと：何をするかではなく「何をしな... //&color(red){例：10人以上の会議には出ない。苦手なことは... ~ ~ #hr CENTER:''進捗記録'' //&color(red){最新の情報を一番上に記載して下さい（古い記... #hr ~ ~ **2026.06.25 -研究概要の見直し -研究そのものの見直し --先行事例の見直し ---先行事例を見直したことでカンディンスキーの造形理論や運... --- -サイト概要を変更 -スケッチ・ドローイング --カンディンスキーの造形原理を身体的に理解するため、オリ... -研究名を変更。 ~ **2026.06.18 ***進捗 -[[森山海莉/情報デザイン研究Iまとめ]]に追記 -作品概要への記載 ~ **2026.06.11 ***進捗 -[[森山海莉/情報デザイン研究Iまとめ]]に追記 -作品概要への記載 - ~ **2026.06.04 ***進捗 -[[森山海莉/情報デザイン研究Iまとめ]]に追記 -作品概要への記載 ~ **2026.05.21 ***進捗 -新たにページを増やしカンディンスキーのデザイン原理をまと... --[[森山海莉/情報デザイン研究Iまとめ]] ~ **審査を終えて　2026.05.14 ***完成イメージ -単に情報を閲覧するWebサイトではなく、ユーザーがスクロー... -載せる情報としてはカンディンスキーのデザイン原理のまとめ... ~ ***デザイン方針 -バウハウスのグリッド構成を基盤としながら、カンディンスキ... 装飾過多にはせず、情報デザインとして成立するミニマルな画... ~ **テーマの変更　2026.05.07 ***ワシリー・カンディンスキーの色彩・形態理論を分析し、現... -テーマ変更の理由 --当初は、デザイン様式の違いによる好感度や理解速度の差異... しかし、このテーマはデザイン様式が表層的な「〜風」の表現... -概要 --本研究では、ワシリー・カンディンスキーの作品に見られる... -背景と目的 --美術館においてワシリー・カンディンスキーの作品を初めて... この「面白さ」は単なる主観的感想ではなく、色彩や形態、構... その感覚の要因を分析・言語化し、再現可能なデザイン原理と... さらに、それらの原理を現代のWebデザインに応用する。 -コンセプト --本研究では、「カンディンスキー風」の表層的な模倣ではな... ~ **2026.04.30 ***研究の流れ -①制作 --同じ情報を使い、異なるデザイン様式で制作する。 -②実験 --制作したデザインを実際に見てもらい、反応を調べる。 -③分析 --集めた結果を比較し、傾向を調べる。 -④ レポート --研究内容を文章としてまとめる。 ---背景・目的 ---制作内容 ---実験方法 ---結果 ---考察 ---結論 ~ **調査　2026.04.23 ***デザインをするにあたっての特徴等 -バウハウス風 --キーワード ---機能主義 / 合理性 / 整理 / 幾何学 / 無駄を省く --特徴 ---装飾より機能を優先 ---グリッド設計 ---読みやすい文字組み ---図形（円・四角・線）で構成 ---非対称レイアウトも多い ---色数が少ない --レイアウト ---きっちり整列 ---左揃え中心 ---カラム設計 ---要素間の余白を明確に --色 --白・黒・赤・青・黄など原色 --2〜3色までに制限 --フォント --サンセリフ体 --太さ違いで階層表現 --装飾 ---線、円、矩形のみで十分 --研究仮説 ---理解速度は最も高くなりやすい ~ -アール・ヌーヴォー風 --キーワード ---自然 / 曲線 / 有機的 / 装飾 / 優雅 --特徴 ---花、植物、蔦、女性像など自然モチーフ ---うねる曲線 ---手仕事感 ---枠や装飾が主役級 --レイアウト ---直線的でなく流れる配置 ---枠を曲線にする ---中央配置も相性良い --色 ---オリーブ、生成り、深緑、金、くすみ色 --フォント ---装飾的セリフ体 (当時のポスターの字はほとんど手書きだか... ---曲線あるロゴタイプ風 --装飾 ---花、葉、蔦、曲線フレーム --研究仮説 ---印象・好感度・記憶残存率が高い可能性 ~ -アールデコ風 --キーワード ---豪華 / 幾何学 / 都会的 / 対称 / 高級感 --特徴 ---直線＋放射線＋階段形 ---シンメトリー ---金属感 ---力強く洗練された印象 --レイアウト ---中央軸で対称 ---タイトル中心配置 ---縦長構図とも相性良い --色 ---黒×金 ---ネイビー×ゴールド ---白×黒 --フォント ---縦長・直線的・クラシック体 --装飾 ---扇形 ---放射線 ---ジグザグ ---フレーム --研究仮説 ---印象は強い、理解速度は中程度 ~ -現代風 (グラスモーフィズム / リキッドグラス) --キーワード ---透明感 / 浮遊感 / UI / 未来感 / 柔らかいデジタル感 --特徴 ---半透明パネル ---背景ぼかし ---ガラス質感 ---光沢 ---レイヤー感 ---丸みのあるUI --レイアウト ---カードUI ---情報をパネル分け ---余白広め --色 ---青、紫、ピンク、白 ---グラデーション --フォント ---現代的サンセリフ --装飾 ---ぼかし ---透明レイヤー ---発光 ---液体っぽい曲面 --研究仮説 ---若年層好感度が高い可能性 ~ ***研究をするにあたって -統一ルール --全様式で固定するもの ---タイトル文言 ---本文量 ---情報順序 ---要素数 ---画像点数 --変えるもの ---配色 ---フォント ---装飾 ---レイアウトの雰囲気 ---余白感 ---視線誘導方法 ~ -軸 情報は伝わったか、早く理解できたか、好印象だったか、記憶... --見やすいデザインと、選ばれるデザインは同じか？ ~ **テーマの絞り込み　2026.04.16 ***デザイン様式によってユーザーの理解速度、または印象が変... -概要 --同じ情報をアール・ヌーヴォー・バウハウスなど異なるデザ... -背景・目的 --現代の情報デザインでは、バウハウスの思想に基づく「シン... -コンセプト --「理解されるデザイン」と「好かれるデザイン」は同じか？ ---同一情報を異なるデザイン様式で提示し、理解速度(どれだ... -調査 --[[99designs>https://99designs.com/inspiration/designs/b... ---「バウハウス（Bauhaus）」スタイルをテーマにしたインス... --[[artposterarchive>https://artposterarchive.com/]] ---ポスターアーカイブサイト ---[[アールデコ参考>https://artposterarchive.com/collecti... ---[[アール・ヌーヴォー参考>https://artposterarchive.com/... --[[研究報告書参考>http://design.kyusan-u.ac.jp/socialdes... ---舞台演出における映像と感情の関係要素を発見するための調... -備考 --対象とするデザイン様式案 (バウハウスとスイス・スタイル... ---バウハウス（機能性・シンプル） ---アール・ヌーヴォー（装飾・有機的） ---アール・デコ（装飾＋幾何学） ---スイス・スタイル（グリッド・可読性重視） ---ポストモダンデザイン（多様性・視覚的インパクト） ---構成主義　（何学・斜め構図・強いコントラスト　視線誘導... ---フラットデザインまたはグラスモーフィズムやリキッドグラ... -やること --それぞれの様式の比較スケッチ ~ ***%%デザイン史を落とす人向けにデザイン史の基本をまとめる%% -概要 --%%大学の講義で理解しづらい「デザイン史」を、初心者でも... -背景・目的 --%%割と基本をわかっていればそこまで難しくないものの、み... --%%→基本をわかりやすく抑えたサイト%% -コンセプト --%%文章よりも視覚（図・レイアウト・比較）重視%% --%%「様式ごとの差」を一目で理解できる構造%% --%%初心者に最適化%% ~ ***%%私自身がすごく痛い思いをしたからこそみんな歯を大切に... -概要 --%%自身の歯のトラブル経験をもとに、歯の重要性や予防の必... -背景・目的 --%%私自身が歯を軽視してとんでもない痛みを経験したから。%% -コンセプト --%%歯の基礎知識はもちろん自身の体験を入れて、警告を促す... ~ ~ **案出しと調査　2026.04.09 ***テーマ案 -興味のあるもの(デザイン史) --現代のグラフィックに、アール・ヌーヴォーのデザインを落... --デザイン史を落とす人向けにデザイン史の基本をまとめる。 --時代や文明ごとに装飾や紋様をまとめ、使用例の提示として... --デザイン様式によってユーザーの理解速度、または印象が変... --バウハウスから学んだデザイン理論を用いてデザインを作成。 ~ -興味のあるもの(webデザイン) --「ゲームつくろうラボ」の東京ゲームショー向けサイト制作 --LPを作成し、視線誘導を研究。 ~ -日常の困りごとや思うこと --バイト先の業務(ミルクの交換、荷物預かり)が難しすぎる。 --SNSにおける一次創作と二次創作の比較。 --私自身がすごく痛い思いをしたからこそみんな歯を大切にし... --趣味が合う人と知り合いたい！情報交換がしたい！多学科の... ~ ***調査 -デザイン史関連 --[[とても簡単に歴史をまとめられているサイト>https://ait-... --[[紋様や様式について幅広くまとめられた本>https://www.am... ~ -webデザイン関連 --[[東京ゲームショウ2025サイト>https://tgs.cesa.or.jp/jp]] ---ポップだが近代風なデザインが参考になるかもしれない --[[2026 webトレンド>https://note.com/kki_design_/n/nea11... ---Bento UI / Bento Grid / モジュラーレイアウト ---ソフトグローグラデーション ---ノスタルジックな幾何学模様 ~ ~

終了行:
*色と幾何学のコンポジション ワシリー・カンディンスキーの作品を分析し、構築したインタ... #image(MV3.jpg) -''森山海莉'' -'''Keywords：Geometry, Color, Kandinsky, Synesthesia''' -[[著書調査>https://design.kyusan-u.ac.jp/socialdesign/?%... -[[絵画分析>https://design.kyusan-u.ac.jp/socialdesign/?%... -[[応用可能な設計要素>https://design.kyusan-u.ac.jp/socia... -[[分析ドローイング集>https://ksumail-my.sharepoint.com/:... //-[[発表用スライド>https://ksumail-my.sharepoint.com/:p:... //-https://www.example.com //-__[[相互評価シート>https://www.example.com]]__ ← ここ... ~ //***CONTENTS //#contents2_1 //~ **概要 ***これは何？ Webのスクロールを時間軸として活用することで、カンディンス... //&color(red){これは何か・・を簡潔に}; ~ ***背景と目的 美術館でワシリー・カンディンスキーの作品を鑑賞した際、他... 現在のWebデザインでは、機能性や可読性を重視した表現が主流... //&color(red){プロジェクトの背景と目的}; ~ ***コンセプト 本研究では、ワシリー・カンディンスキーの作品を色彩・形態... さらに、その造形原理をスクロール(いわゆる時間軸)と組み合... //&color(red){基本的な考え方、枠組み、視点など}; ~ ***成果物の仕様 webサイト //&color(red){&small(成果物の形式・サイズ・時間尺等);}; ~ ***制作ツール -figma -Illustrator -Procreate -VScode -claude(補助として活用してみる) //&color(red){使用するツール｜ハードウエア・ソフトウエア}; ~ ***プロジェクトの期間 2026.04.09~ //&color(red){プロジェクトの期間｜20XX.XX.XX - 20XX.XX.XX... ~ ***まとめ 本研究では、カンディンスキーの著書や作品分析、ドローイン... //&color(red){プロジェクトが完結したら「まとめ」を記載し... ~ ~ **調査 ***現状調査 -Webデザインでは機能性や可読性が重視され、芸術理論の応用... --バウハウスの影響を受けたWebデザインは多いが、その多くは... --[[バウハウス創立100周年を記念して制作された公式プロジェ... --[[ドイツのプロダクトデザイナー、ディーター・ラムスがデ... --[[「Bauhaus」をテーマにした受賞Webサイトをまとめたギャ... -- -カンディンスキーの造形理論や運動性をインタラクティブに応... --[[画面をマウスでドラッグすると、システムがそれを自動認... --[[代表作『黄・赤・青』を「触れる音楽インストゥルメント... //&color(red){プロジェクトのテーマに関わる社会の現状と問... ~ ***先行事例 先行事例として、カンディンスキー自身が幾何学の力に着目し... またカンディンスキーは「絵画を音楽のような芸術にしたい」... ~ -カンディンスキー自身の著書 --[[点と線から面へ>https://www.chikumashobo.co.jp/product... --カンディンスキーの作品は、なぜ画面から音が聴こえてくる... --[[著書の内容をまとめたもの>https://design.kyusan-u.ac.j... -カンディンスキーの共感覚 --カンディンスキーは「色や形を音として聴き、音を色として... --[[共感覚について>https://artsandculture.google.com/stor... --[[カンディンスキーが提唱した「共感覚」を、誰もが直感的... ~ -インタラクティブサイト --[[キャンバスに描いた幾何学図形がそのまま音に変換される... --[[PCのキーボードを叩いたり、マウスを動かしたりすると幾... --[[スクロールするとセクションごとに図形や色彩の切り替わ... -p5.js --Webブラウザ上で数行のコードを書くだけで、簡単にグラフィ... --[[世界中のコーダーがp5.jsで作った作品を投稿している最大... ~ -影響を受けた音楽家 --リヒャルト・ワーグナー ---カンディンスキーが若い頃にオペラ ローエングリンを鑑賞... ---後に、「音楽を聴いている最中、私の目の前に、モスクワの... ---[[ローエングリン」第3幕への前奏曲>https://youtu.be/29d... --アルノルト・シェーンベルク ---カンディンスキーに最も思想的な影響を与えた音楽家。1911... ---当時のシェーンベルクは、従来のクラシック音楽のルール（... ---[[3つのピアノ曲 作品11（Drei Klavierstücke Op.11）>htt... ---これまでのクラシック音楽にあった「ハ長調」や「ト短調」... ---[[弦楽四重奏曲 第2番 嬰へ短調 作品10（Streichquartett ... ---弦楽四重奏（ヴァイオリン2、ヴィオラ、チェロ）に、「ソ... ~ ***技法・技術情報 //&color(red){プロジェクトの遂行に必要な技法・技術に関す... ~ ~ **プロジェクト管理 ***スケジュール [[スプレッドシート>https://docs.google.com/spreadsheets/d... //&color(red){計画的な遂行のために、進行管理表を作成して... ~ ***ToDo ① 調査・分析 目的：カンディンスキーの造形理論とWeb表現の特徴を理解し、... %%-インタラクティブWebサイトの調査%% %%-スクロール演出を用いたWebサイトの調査%% %%-カンディンスキーの著書（『点・線・面』など）の読解%% %%-カンディンスキー作品の分析（点・線・面・色彩・構図・リ... %%- Webデザインへ応用可能なデザイン原理の抽出%% ────────────────── ② ドローイング・スケッチ 目的：抽出した造形原理を理解・再構成し、スクロールによる... -カンディンスキー作品の分解スケッチ（点・線・面・構図） -造形要素を組み替えた再構成ドローイング -スクロールによる図形変化のアイデアスケッチ -スクロールごとの画面遷移（絵コンテ）の作成 - Webで使用する図形・モチーフの選定 ────────────────── ③ コンセプト・情報設計 目的：サイト全体の体験と構成を設計する。 -サイトコンセプトの策定 -ユーザー体験（UX）の設計 -サイトマップの作成 -ワイヤーフレームの作成 - スクロールフローの設計 -各セクションの役割整理 ───────────────── ④ ビジュアル・インタラクション設計 目的：カンディンスキーの理論を反映したWebデザインを具体化... -配色設計 -タイポグラフィ選定 -レイアウト設計 -図形・アニメーション設計 -スクロールと図形変化の対応関係の整理 -プロトタイプ作成 ────────────────── ⑤ 実装 目的：設計内容をWeb上で実現する。 -HTML構築 -CSSデザイン -スクロールアニメーションの実装 -レスポンシブ対応 -パフォーマンス調整 ────────────────── ⑥ 評価・改善 目的：制作物が研究目的を満たしているかを検証する。 -動作確認 -ユーザーテスト -改善点の抽出 -デザイン・実装の修正 -最終成果物の完成 //&color(red){やるべきこと（タスク）を箇条書きにします。}; //&color(red){完了後は「%%取り消し線%%」あるいは「// コメ... //***NotToDo //&color(red){やらないこと：何をするかではなく「何をしな... //&color(red){例：10人以上の会議には出ない。苦手なことは... ~ ~ #hr CENTER:''進捗記録'' //&color(red){最新の情報を一番上に記載して下さい（古い記... #hr ~ ~ **2026.06.25 -研究概要の見直し -研究そのものの見直し --先行事例の見直し ---先行事例を見直したことでカンディンスキーの造形理論や運... --- -サイト概要を変更 -スケッチ・ドローイング --カンディンスキーの造形原理を身体的に理解するため、オリ... -研究名を変更。 ~ **2026.06.18 ***進捗 -[[森山海莉/情報デザイン研究Iまとめ]]に追記 -作品概要への記載 ~ **2026.06.11 ***進捗 -[[森山海莉/情報デザイン研究Iまとめ]]に追記 -作品概要への記載 - ~ **2026.06.04 ***進捗 -[[森山海莉/情報デザイン研究Iまとめ]]に追記 -作品概要への記載 ~ **2026.05.21 ***進捗 -新たにページを増やしカンディンスキーのデザイン原理をまと... --[[森山海莉/情報デザイン研究Iまとめ]] ~ **審査を終えて　2026.05.14 ***完成イメージ -単に情報を閲覧するWebサイトではなく、ユーザーがスクロー... -載せる情報としてはカンディンスキーのデザイン原理のまとめ... ~ ***デザイン方針 -バウハウスのグリッド構成を基盤としながら、カンディンスキ... 装飾過多にはせず、情報デザインとして成立するミニマルな画... ~ **テーマの変更　2026.05.07 ***ワシリー・カンディンスキーの色彩・形態理論を分析し、現... -テーマ変更の理由 --当初は、デザイン様式の違いによる好感度や理解速度の差異... しかし、このテーマはデザイン様式が表層的な「〜風」の表現... -概要 --本研究では、ワシリー・カンディンスキーの作品に見られる... -背景と目的 --美術館においてワシリー・カンディンスキーの作品を初めて... この「面白さ」は単なる主観的感想ではなく、色彩や形態、構... その感覚の要因を分析・言語化し、再現可能なデザイン原理と... さらに、それらの原理を現代のWebデザインに応用する。 -コンセプト --本研究では、「カンディンスキー風」の表層的な模倣ではな... ~ **2026.04.30 ***研究の流れ -①制作 --同じ情報を使い、異なるデザイン様式で制作する。 -②実験 --制作したデザインを実際に見てもらい、反応を調べる。 -③分析 --集めた結果を比較し、傾向を調べる。 -④ レポート --研究内容を文章としてまとめる。 ---背景・目的 ---制作内容 ---実験方法 ---結果 ---考察 ---結論 ~ **調査　2026.04.23 ***デザインをするにあたっての特徴等 -バウハウス風 --キーワード ---機能主義 / 合理性 / 整理 / 幾何学 / 無駄を省く --特徴 ---装飾より機能を優先 ---グリッド設計 ---読みやすい文字組み ---図形（円・四角・線）で構成 ---非対称レイアウトも多い ---色数が少ない --レイアウト ---きっちり整列 ---左揃え中心 ---カラム設計 ---要素間の余白を明確に --色 --白・黒・赤・青・黄など原色 --2〜3色までに制限 --フォント --サンセリフ体 --太さ違いで階層表現 --装飾 ---線、円、矩形のみで十分 --研究仮説 ---理解速度は最も高くなりやすい ~ -アール・ヌーヴォー風 --キーワード ---自然 / 曲線 / 有機的 / 装飾 / 優雅 --特徴 ---花、植物、蔦、女性像など自然モチーフ ---うねる曲線 ---手仕事感 ---枠や装飾が主役級 --レイアウト ---直線的でなく流れる配置 ---枠を曲線にする ---中央配置も相性良い --色 ---オリーブ、生成り、深緑、金、くすみ色 --フォント ---装飾的セリフ体 (当時のポスターの字はほとんど手書きだか... ---曲線あるロゴタイプ風 --装飾 ---花、葉、蔦、曲線フレーム --研究仮説 ---印象・好感度・記憶残存率が高い可能性 ~ -アールデコ風 --キーワード ---豪華 / 幾何学 / 都会的 / 対称 / 高級感 --特徴 ---直線＋放射線＋階段形 ---シンメトリー ---金属感 ---力強く洗練された印象 --レイアウト ---中央軸で対称 ---タイトル中心配置 ---縦長構図とも相性良い --色 ---黒×金 ---ネイビー×ゴールド ---白×黒 --フォント ---縦長・直線的・クラシック体 --装飾 ---扇形 ---放射線 ---ジグザグ ---フレーム --研究仮説 ---印象は強い、理解速度は中程度 ~ -現代風 (グラスモーフィズム / リキッドグラス) --キーワード ---透明感 / 浮遊感 / UI / 未来感 / 柔らかいデジタル感 --特徴 ---半透明パネル ---背景ぼかし ---ガラス質感 ---光沢 ---レイヤー感 ---丸みのあるUI --レイアウト ---カードUI ---情報をパネル分け ---余白広め --色 ---青、紫、ピンク、白 ---グラデーション --フォント ---現代的サンセリフ --装飾 ---ぼかし ---透明レイヤー ---発光 ---液体っぽい曲面 --研究仮説 ---若年層好感度が高い可能性 ~ ***研究をするにあたって -統一ルール --全様式で固定するもの ---タイトル文言 ---本文量 ---情報順序 ---要素数 ---画像点数 --変えるもの ---配色 ---フォント ---装飾 ---レイアウトの雰囲気 ---余白感 ---視線誘導方法 ~ -軸 情報は伝わったか、早く理解できたか、好印象だったか、記憶... --見やすいデザインと、選ばれるデザインは同じか？ ~ **テーマの絞り込み　2026.04.16 ***デザイン様式によってユーザーの理解速度、または印象が変... -概要 --同じ情報をアール・ヌーヴォー・バウハウスなど異なるデザ... -背景・目的 --現代の情報デザインでは、バウハウスの思想に基づく「シン... -コンセプト --「理解されるデザイン」と「好かれるデザイン」は同じか？ ---同一情報を異なるデザイン様式で提示し、理解速度(どれだ... -調査 --[[99designs>https://99designs.com/inspiration/designs/b... ---「バウハウス（Bauhaus）」スタイルをテーマにしたインス... --[[artposterarchive>https://artposterarchive.com/]] ---ポスターアーカイブサイト ---[[アールデコ参考>https://artposterarchive.com/collecti... ---[[アール・ヌーヴォー参考>https://artposterarchive.com/... --[[研究報告書参考>http://design.kyusan-u.ac.jp/socialdes... ---舞台演出における映像と感情の関係要素を発見するための調... -備考 --対象とするデザイン様式案 (バウハウスとスイス・スタイル... ---バウハウス（機能性・シンプル） ---アール・ヌーヴォー（装飾・有機的） ---アール・デコ（装飾＋幾何学） ---スイス・スタイル（グリッド・可読性重視） ---ポストモダンデザイン（多様性・視覚的インパクト） ---構成主義　（何学・斜め構図・強いコントラスト　視線誘導... ---フラットデザインまたはグラスモーフィズムやリキッドグラ... -やること --それぞれの様式の比較スケッチ ~ ***%%デザイン史を落とす人向けにデザイン史の基本をまとめる%% -概要 --%%大学の講義で理解しづらい「デザイン史」を、初心者でも... -背景・目的 --%%割と基本をわかっていればそこまで難しくないものの、み... --%%→基本をわかりやすく抑えたサイト%% -コンセプト --%%文章よりも視覚（図・レイアウト・比較）重視%% --%%「様式ごとの差」を一目で理解できる構造%% --%%初心者に最適化%% ~ ***%%私自身がすごく痛い思いをしたからこそみんな歯を大切に... -概要 --%%自身の歯のトラブル経験をもとに、歯の重要性や予防の必... -背景・目的 --%%私自身が歯を軽視してとんでもない痛みを経験したから。%% -コンセプト --%%歯の基礎知識はもちろん自身の体験を入れて、警告を促す... ~ ~ **案出しと調査　2026.04.09 ***テーマ案 -興味のあるもの(デザイン史) --現代のグラフィックに、アール・ヌーヴォーのデザインを落... --デザイン史を落とす人向けにデザイン史の基本をまとめる。 --時代や文明ごとに装飾や紋様をまとめ、使用例の提示として... --デザイン様式によってユーザーの理解速度、または印象が変... --バウハウスから学んだデザイン理論を用いてデザインを作成。 ~ -興味のあるもの(webデザイン) --「ゲームつくろうラボ」の東京ゲームショー向けサイト制作 --LPを作成し、視線誘導を研究。 ~ -日常の困りごとや思うこと --バイト先の業務(ミルクの交換、荷物預かり)が難しすぎる。 --SNSにおける一次創作と二次創作の比較。 --私自身がすごく痛い思いをしたからこそみんな歯を大切にし... --趣味が合う人と知り合いたい！情報交換がしたい！多学科の... ~ ***調査 -デザイン史関連 --[[とても簡単に歴史をまとめられているサイト>https://ait-... --[[紋様や様式について幅広くまとめられた本>https://www.am... ~ -webデザイン関連 --[[東京ゲームショウ2025サイト>https://tgs.cesa.or.jp/jp]] ---ポップだが近代風なデザインが参考になるかもしれない --[[2026 webトレンド>https://note.com/kki_design_/n/nea11... ---Bento UI / Bento Grid / モジュラーレイアウト ---ソフトグローグラデーション ---ノスタルジックな幾何学模様 ~ ~

ページ名: