奈須本真椰/情報デザイン研究II
をテンプレートにして作成
HOME
ABOUT
最新の更新
2021
MEMBER 2021
青木暁光
石坂大翔
出光美心
岩崎貴生
岩下雄真
内尾颯太
江川珠貴
大中啓旦
亀田日向
川村洸太
木村円香
久保絢菜
倉員優実
桑原歩未
鴻上早紀
崔昊
佐光美憂
柴田一輝
竹谷匠冬
田籠祐貴
田代爽乃
内藤彩乃
西山実伶
濱有希子
濱田侑里
藤本唯人
松岡佑樹
松藤陽
村山陽菜
山田宗周
渡邊来美
渡辺侑貴
中西華子
原田朋奈
水田修太朗
宮副咲葉
猪須大翔
川面翔太
隈翔太
柴田葉月
角祐菜
豊岡壮大朗
吉井麻吏菜
2022
MEMBER 2022
棈松智也
梅木悠民
江頭奏
大井このか
大石颯
太田糸音
太田姫奈
越智楓
鎌田真幸
楠田佑月
興梠媛愛
後藤太成
坂井彩華
指方依緒
徐泰陽
杉野市之助
堤晴司
角田雄一
中井千尋
原朋恵
平嶋明日花
増田里奈
深町彩海
藤島早希
宮路咲希
梁井英翔
山口愛麗
山本彩花
松田葉奈
松本龍太郎
熊谷涼花
近藤ひかる
善結穂
待永萌衣
三浦遥
石松匡広
上田莉帆
宇田川春稀
宇美希美
佐野美和
竹之内咲希
土斐崎種定
野村優亜
福田千紗
山川彩香
山田侑加子
重松優花
甲斐陸斗
2023
MEMBER 2023
秋月靖雅
浅田真優花
阿南慶子
荒谷唯斗
安藤貴仁
池邉成
井上大河
岩本愛結
梅﨑美和
浦朱里
江村梨里香
大場こころ
勝田喜一
亀崎瑞穂
神田舞
白井くるみ
髙市遥
竹松莉羽
寺田圭志
中村心香
原晴紀
菱谷実来
日山晃良
平崎千夏
福井涼
堀玲二
早稲田加奈恵
渡邊優希
十時明日香
石井彩晶
大神槙之介
大熊玄樹
大山花音
岡萌絵子
荻野美咲
鐘ヶ江雅
金田桜子
北村美優香
清野梨果
高庄玲衣
津覇稜也
福屋早希乃
脇山千寛
2024
MEMBER 2024
芦谷心渚
安部詩織
池田隆之介
伊藤早紀
越智花凛
金ヶ江光千瑠
佐藤澪
川村玲太
菊池真桜
後藤未羽
齊場由布
佐々木陽菜
猿本大翔
竹之内優希
田尻有沙
谷口和歌子
千々岩聡真
手島凜
鳥越友菜
中尾桃瀬
庭瀬美来
野口朗央
福岡比菜
松崎菜々実
松永紗和
真子大輝
南妃香莉
宮園晴日
森山海莉
劉沢寧
渡辺颯香
足立実優
池田阜弥
井上朋美
宇野日菜
上瀧桃子
佐藤美月
茂山和寛
髙嶋莉彩
橘彩以
田中さゆり
田村宥奈
徳永歩乃佳
轟はなの
橋本音花
若狭映那
STAFF
専任教員一覧
伊藤敬生
井上貢一
井上友子
岩田敦之
桜井祐
永嶋さゆり
北島己佐吉
OBOG
2023年度卒業生
2022年度卒業生
2021年度卒業生
2020年度卒業生
2019年度卒業生
SESSION
専門科目一覧
ソーシャルデザイン概論
ソーシャルデザイン演習
情報デザイン演習IIA
情報デザイン演習IIB
地域ブランド企画演習IIA
地域ブランド企画演習IIB
視覚デザイン演習
Webデザイン演習
情報デザイン研究I
地域ブランド企画研究I
3DCG演習
卒業研究
教務ガイダンス
RecommendedVideo
BasicKnowledge
PROJECT
LINKS
SEARCH
開始行:
*夏のクール便 ー ひんやり瓶
訪れた人に夏を届けるWebサイト
//ここは、夏を届ける空間です
~
#image(main_03.jpg)
~
-''奈須本真椰''
-'''Keywords:夏,空気感'''
//-https://maya-des.github.io/summer_cool/
//-https://maya-des.github.io/cool_sample09/ (更新中)
-https://maya-des.github.io/summer_cool/ ※PCからの閲覧推奨
~
~
**概要
~
***これは何?
//&color(red){これは何か・・を簡潔に};
イラスト×Webサイト:「夏」をモチーフに物語が展開していくW...
//アニメーション×グッズ
~
***背景と目的
//&color(red){プロジェクトの背景と目的};
近年、日本の夏が暑すぎることから、「夏」というものに対し...
そのためサイト上のイラストを郵便物(=ひんやりした瓶)に...
//また、私は夏の空・海の青色にセーラー服の紺色が溶け込む...
//近年ではセーラー服をモチーフとしたファッションや楽曲、...
//こういったセーラー服が好きな人がこのWebサイトを訪れた際...
//~
//また、来年の卒業研究では、グッズを制作し販売したいと考...
~
***コンセプト
//&color(red){基本的な考え方、枠組み、視点など};
まるで自分もそこにいるかのような、夏の一瞬の“涼しげな”空...
これらを郵便物(=ひんやりした瓶)に見立て、Webサイトを訪...
日記風に文章を書き留めることで、よりリアリティを演出させる
「暑い」という単語を使わずに夏の暑さを表現し、「涼しい」...
~
***成果物の仕様
//&color(red){&small(成果物の形式・サイズ・時間尺等);};
イラストのサイズ:1024×768
GitHubを用いた、画面をスクロールすることで物語が展開して...
//動画のサイズ:16:9
//グッズのサイズ:キーホルダーやアクリルスタンドなど、小...
~
***制作ツール
//&color(red){使用するツール|ハードウエア・ソフトウエア};
スマホ(ibisPaint X)、PC(GitHub)
//グッズ(PixivFACTORY)
~
***プロジェクトの期間
//&color(red){プロジェクトの期間|20XX.XX.XX - 20XX.XX.XX...
[[進行管理表>https://docs.google.com/spreadsheets/d/1feCc...
~
//***まとめ(中間発表時点)
//&color(red){プロジェクトが完結したら「まとめ」を記載し...
//テーマに沿ったWebサイトの基盤や、キャラクターデザイン、...
***まとめ
サイト内にオープニングアニメーションや効果音などを取り入...
これから卒業研究などで自身の作品の世界観を表現する際に活...
~
~
**調査
~
***現状調査
//&color(red){プロジェクトのテーマに関わる社会の現状と問...
-近年日本の夏が暑すぎることから、「夏」というものに対し嫌...
[[リンク1>https://toyokeizai.net/articles/-/229965?page=2]]
//-近年ではセーラー服をモチーフとしたファッションや楽曲、...
//-イラスト投稿サイトのPixivではセーラー服に関する投稿が1...
//-PixivFACTORYを用いることで個人用に様々な種類のグッズを...
~
***先行事例
//&color(red){プロジェクトのテーマに該当する先行事例の紹...
//-オリジナルグッズのイメージ(URL:https://shopzokuzoku....
-シンプルな作りのWebサイト(URL:https://demos.freehtml5....
-日記風のWebサイト(URL:https://monokai.nl/2019/japan/)...
//-ストーリーテリングを導入したWebサイト(URL:http://let...
-アニメーションを取り入れたWebサイト(URL:https://es-cin...
~
***技法・技術情報
//&color(red){プロジェクトの遂行に必要な技法・技術に関す...
-オープニングアニメーションの取り入れ方(URL:https://www...
//-セーラー服の構造(URL:https://www.schoolwear-shop.com...
//-WordPressでgifアニメーションを取り入れる方法(URL:htt...
//-Webサイトに用いたイラストをモチーフにしたグッズの製作...
~
~
**プロジェクト管理
~
***スケジュール
//&color(red){計画的な遂行のために、進行管理表を作成して...
[[進行管理表>https://docs.google.com/spreadsheets/d/1feCc...
~
***ToDo
//&color(red){やるべきこと(タスク)を箇条書きにします。};
//&color(red){完了後は「%%取り消し線%%」あるいは「// コメ...
-%%テーマの決定%%
-%%メインビジュアルの作成%%
-%%ストーリー構成の考案%%
-%%キャラクターデザイン%%
-%%Webサイトの試作%%
-%%セクションごとに背景やサイズを変更%%
-%%オープニングアニメーションの追加%%
-%%フッターのアドレス変更%%
-%%お楽しみ要素のシステム導入%%
-%%イラストのサイズの変更%%
-%%イラストの枠の削除%%
-%%メニュー表示の削除又はハンバーガーメニューの導入%%
-%%特典画像の作成%%
-%%イラストの作成%%
//-挨拶文の削除又は後書きページの作成
//-WebサイトそのものにBGMを導入
~
-効果音再生アイコンの作成
-スマホ用の画面サイズの設定
-ギャラリー内の画像を拡大するシステムの導入
-スクロールすると画像が下からフェードインするシステムの導入
//***NotToDo
//&color(red){やらないこと:何をするかではなく「何をしな...
//&color(red){例:10人以上の会議には出ない。苦手なことは...
~
~
#hr
CENTER:''進捗記録''
//&color(red){最新の情報を一番上に記載して下さい(古い記...
#hr
~
~
**2021.12.22
~
***Webサイトの作成
//https://maya-des.github.io/cool_sample07/
https://maya-des.github.io/cool_sample09/
~
-メニュー表示を削除し、ハンバーガーメニューを導入した。
-画面がゆっくりとスクロールする仕組みを導入した。
~
***イラストの作成
~
|#image(story_19.jpg)||#image(story_20.jpg)||#image(story...
~
|#image(story_22.jpg)||#image(story_23.jpg)|
~
-主人公が寄り道した後に帰宅する場面。寒色系の色を用いて、...
~
***特典イラストの作成
~
#image(sp_right.jpg,,70%)
~
-正しい数字を選択すると特典画像が表示される仕組みを導入し...
~
~
**2021.12.15
~
***Webサイトの作成
https://maya-des.github.io/cool_sample06/
~
-イラストや文字のサイズを変更し、イラストの枠を削除した。
~
***イラストの作成
~
|#image(story_15.jpg)||#image(story_16.jpg)|
~
|#image(story_18.jpg)||#image(story_17.jpg)|
~
-主人公が寄り道する場面。暖色系の色を用いて、前の場面より...
~
***今週の目標
-イラストの作成
-サイト全体のレイアウトの更新
~
~
**2021.12.08
~
***Webサイトの作成
https://maya-des.github.io/summer_cool01/
~
-お楽しみ要素のシステムを導入。
-挨拶文や説明文、イラストや効果音の追加。
~
***イラストの作成
~
|#image(gallery_09.jpg)||#image(gallery_10.jpg)||#image(g...
~
|#image(gallery_12.jpg)||#image(gallery_13.jpg)||#image(g...
~
-主人公が登校する場面。暖色系の色を用いて、前の場面よりも...
~
***プレゼンを通して見つかった改善点
-メインであるイラストのサイズはもっと大きく(絵を魅せる)
-現代的なWebサイトの完成を目標としているので、メニュー表...
-挨拶文も消す?(いきなりストーリーを始めても良い)
-イラストの枠をより細く、目立ちすぎないようにする
-効果音再生アイコンの作成
-より世界観を演出するために、WebサイトそのものにBGMを導入...
~
***今週の目標
-イラストの作成
-サイト全体のレイアウトの更新
~
~
**2021.12.01
~
***Webサイトの試作
https://maya-des.github.io/cool_sample04/
-オープニングアニメーションを導入し、効果音を追加したこと...
-htmlのエラー部分を改善。
~
***今週の目標
-ストーリーに用いるイラストや、特典イラストの作成
-サイト全体のレイアウトの更新
-お楽しみ要素のシステム導入
-ギャラリー内の画像を拡大するシステム導入
-フッターのアドレス変更
~
-プレゼン準備
~
~
**2021.11.24
~
***イラストの作成
~
|#image(gallery_06.jpg)||#image(gallery_07.jpg)||#image(g...
~
-主人公が朝の身支度をする場面。暖色系の色を用いて、前の場...
~
***今週の目標
-ストーリーに用いるイラストや、特典イラストの作成
-サイト全体のレイアウトの更新
-オープニングアニメーションの追加
-お楽しみ要素のシステム導入
~
~
**2021.11.17
~
***Webサイトの試作
https://maya-des.github.io/cool_sample03/
-背景の色や画面サイズを変更。
-お楽しみ要素について説明文の追加。
~
***今週の目標
-ストーリーに用いるイラストや、特典イラストの作成
-サイト全体のレイアウトの更新
~
~
**2021.11.10
~
***Webサイトの試作
https://maya-des.github.io/cool_sample02/
-イラストを追加し、背景の色を変更。
~
***イラストの作成
~
|#image(story_01.jpg)||#image(story_02.jpg)||#image(story...
~
|#image(story_04.jpg)||#image(story_05.jpg)|
~
-主人公がセミの鳴き声で起床する場面。寒色系の色を用いて、...
~
***試作(ラフ)
-[[部屋のラフ>https://drive.google.com/file/d/14hjdJ7T9A5...
寒色系の色を用いて、涼しげなイメージの部屋を表現。
~
***今週の目標
-イラストの作成
-サイト全体のレイアウトの更新
-特典イラストの作成
~
~
**2021.10.27
~
***Webサイトの試作
https://maya-des.github.io/cool_sample01/
~
#image(sitemap_01.jpg,,70%)
~
#image(sitemap_02.jpg,,70%)
~
-ボタンを押すと夏の音が聞こえてくる演出や、動画が再生され...
~
***今週の目標
-イラストの作成
~
~
**2021.10.20
~
***Webサイトの構成ラフ
[[Webサイトラフ1>https://drive.google.com/file/d/19GGCJ-H...
[[Webサイトラフ2>https://drive.google.com/file/d/19H7N4-l...
~
-ストーリーの箇所のみ背景を変更。
~
#image(sky.jpg,,70%)
~
-画面をスクロールすることで、朝→夜へと時間が移り変わって...
~
***今週の目標
-Webサイトの試作
-イラストの試作
~
~
**2021.10.13
~
***ストーリー構成の考案
[[ストーリー構成1>https://drive.google.com/file/d/13aLL-M...
[[ストーリー構成2>https://drive.google.com/file/d/13bUYfT...
[[ストーリー構成3>https://drive.google.com/file/d/13cIix0...
[[ストーリー構成4>https://drive.google.com/file/d/13jxp7C...
-「暑い」という単語を使わずに夏の暑さを表現し、「涼しい」...
-画面をスクロールすることで、朝→夜へと時間が移り変わって...
-お楽しみ(?)要素として、それぞれのイラストに「夏」らし...
~
-グッズは時間に余裕がある場合?研究の後にでも個人用に
~
***キャラクターデザイン
~
#image(character_design.jpg,,70%)
~
-主人公の視点(一人称視点)で物語を進めることで、よりリア...
-主人公は物語の中で会話をしないため、口はあえて描かない(...
~
***メインビジュアルの変更
~
#image(main_02.jpg)
~
-メインビジュアルと実際のWebサイトの内容をリンクさせたも...
~
***今週の目標
-Webサイトの試作
-イラストの試作
~
~
**2021.10.6
~
***メインビジュアルの作成
~
#image(main_01.jpg)
~
-「夏」の概念が詰まった郵便物をイメージ。
~
***試作(ラフ)
-[[グッズラフ>https://drive.google.com/file/d/10l3USi1Tpw...
Webサイトに用いたイラストをモチーフにしたグッズを製作する...
-[[Webサイトラフ>https://drive.google.com/file/d/10p3MPYA...
主に色合いを工夫し、涼しげな印象を与えるWebサイトを作成す...
~
***今週の目標
-ストーリー構成の考案
-キャラクターデザイン
-Webサイトの試作
-イラストの試作
~
~
**2021.9.29
~
***テーマの決定
-「夏のクール便(ひんやり瓶)」:夏の概念がたくさん詰まっ...
-WordPressではなくGitHubを用いる?
~
***調査
-シンプルな作りのWebサイト(URL:https://demos.freehtml5....
-オープニングアニメーションの取り入れ方(URL:https://www...
~
//***試作(グッズのラフ)
//-Google Driveのリンクを貼る
//~
***今週の目標
-メインビジュアルの制作
-Webサイトの試作
-イラストの試作
~
~
**2021.9.22
~
***概要(テーマのメモ)
-イラスト×アニメーション×Webサイト:「概念的な夏」「セー...
-イラスト×グッズ:Webサイトに用いたイラストをモチーフにし...
~
***調査
-オリジナルグッズ(URL:https://shopzokuzoku.thebase.in/...
-アニメーションを取り入れたWebサイト1※音が出ます(URL:ht...
-アニメーションを取り入れたWebサイト2(URL:https://es-ci...
-物語が展開していくWebサイト1(URL:http://yourpower.pand...
-物語が展開していくWebサイト2(URL:https://thebearandhis...
-日記風のWebサイト(URL:https://monokai.nl/2019/japan/)...
-ストーリーテリングを導入したWebサイト(URL:http://lette...
~
***今週の目標
-テーマの決定
-イラストやグッズ(ラフ)の試作
~
~
**2021.9.15
~
***概要(テーマのメモ)
-イラスト×アニメーション×Webサイト:「概念的な夏」「セー...
~
***使用するツール
-ibisPaint X
-Adobe After Effects
-WordPress
~
***調査
-セーラー服について(URL:https://www.schoolwear-shop.com...
-WordPressでgifアニメーションを取り入れる方法(URL:https...
-個人的に好きな構成のWebサイト(URL:https://es-cinnamon....
~
***卒業研究に向けての長期的な目標
-3年生(情報デザイン研究)では主にイラストの作成やそれを...
-4年生(卒業研究)では主にセーラー服をモチーフにしたグッ...
~
***今週の目標
-テーマの決定
~
~
~
~
終了行:
*夏のクール便 ー ひんやり瓶
訪れた人に夏を届けるWebサイト
//ここは、夏を届ける空間です
~
#image(main_03.jpg)
~
-''奈須本真椰''
-'''Keywords:夏,空気感'''
//-https://maya-des.github.io/summer_cool/
//-https://maya-des.github.io/cool_sample09/ (更新中)
-https://maya-des.github.io/summer_cool/ ※PCからの閲覧推奨
~
~
**概要
~
***これは何?
//&color(red){これは何か・・を簡潔に};
イラスト×Webサイト:「夏」をモチーフに物語が展開していくW...
//アニメーション×グッズ
~
***背景と目的
//&color(red){プロジェクトの背景と目的};
近年、日本の夏が暑すぎることから、「夏」というものに対し...
そのためサイト上のイラストを郵便物(=ひんやりした瓶)に...
//また、私は夏の空・海の青色にセーラー服の紺色が溶け込む...
//近年ではセーラー服をモチーフとしたファッションや楽曲、...
//こういったセーラー服が好きな人がこのWebサイトを訪れた際...
//~
//また、来年の卒業研究では、グッズを制作し販売したいと考...
~
***コンセプト
//&color(red){基本的な考え方、枠組み、視点など};
まるで自分もそこにいるかのような、夏の一瞬の“涼しげな”空...
これらを郵便物(=ひんやりした瓶)に見立て、Webサイトを訪...
日記風に文章を書き留めることで、よりリアリティを演出させる
「暑い」という単語を使わずに夏の暑さを表現し、「涼しい」...
~
***成果物の仕様
//&color(red){&small(成果物の形式・サイズ・時間尺等);};
イラストのサイズ:1024×768
GitHubを用いた、画面をスクロールすることで物語が展開して...
//動画のサイズ:16:9
//グッズのサイズ:キーホルダーやアクリルスタンドなど、小...
~
***制作ツール
//&color(red){使用するツール|ハードウエア・ソフトウエア};
スマホ(ibisPaint X)、PC(GitHub)
//グッズ(PixivFACTORY)
~
***プロジェクトの期間
//&color(red){プロジェクトの期間|20XX.XX.XX - 20XX.XX.XX...
[[進行管理表>https://docs.google.com/spreadsheets/d/1feCc...
~
//***まとめ(中間発表時点)
//&color(red){プロジェクトが完結したら「まとめ」を記載し...
//テーマに沿ったWebサイトの基盤や、キャラクターデザイン、...
***まとめ
サイト内にオープニングアニメーションや効果音などを取り入...
これから卒業研究などで自身の作品の世界観を表現する際に活...
~
~
**調査
~
***現状調査
//&color(red){プロジェクトのテーマに関わる社会の現状と問...
-近年日本の夏が暑すぎることから、「夏」というものに対し嫌...
[[リンク1>https://toyokeizai.net/articles/-/229965?page=2]]
//-近年ではセーラー服をモチーフとしたファッションや楽曲、...
//-イラスト投稿サイトのPixivではセーラー服に関する投稿が1...
//-PixivFACTORYを用いることで個人用に様々な種類のグッズを...
~
***先行事例
//&color(red){プロジェクトのテーマに該当する先行事例の紹...
//-オリジナルグッズのイメージ(URL:https://shopzokuzoku....
-シンプルな作りのWebサイト(URL:https://demos.freehtml5....
-日記風のWebサイト(URL:https://monokai.nl/2019/japan/)...
//-ストーリーテリングを導入したWebサイト(URL:http://let...
-アニメーションを取り入れたWebサイト(URL:https://es-cin...
~
***技法・技術情報
//&color(red){プロジェクトの遂行に必要な技法・技術に関す...
-オープニングアニメーションの取り入れ方(URL:https://www...
//-セーラー服の構造(URL:https://www.schoolwear-shop.com...
//-WordPressでgifアニメーションを取り入れる方法(URL:htt...
//-Webサイトに用いたイラストをモチーフにしたグッズの製作...
~
~
**プロジェクト管理
~
***スケジュール
//&color(red){計画的な遂行のために、進行管理表を作成して...
[[進行管理表>https://docs.google.com/spreadsheets/d/1feCc...
~
***ToDo
//&color(red){やるべきこと(タスク)を箇条書きにします。};
//&color(red){完了後は「%%取り消し線%%」あるいは「// コメ...
-%%テーマの決定%%
-%%メインビジュアルの作成%%
-%%ストーリー構成の考案%%
-%%キャラクターデザイン%%
-%%Webサイトの試作%%
-%%セクションごとに背景やサイズを変更%%
-%%オープニングアニメーションの追加%%
-%%フッターのアドレス変更%%
-%%お楽しみ要素のシステム導入%%
-%%イラストのサイズの変更%%
-%%イラストの枠の削除%%
-%%メニュー表示の削除又はハンバーガーメニューの導入%%
-%%特典画像の作成%%
-%%イラストの作成%%
//-挨拶文の削除又は後書きページの作成
//-WebサイトそのものにBGMを導入
~
-効果音再生アイコンの作成
-スマホ用の画面サイズの設定
-ギャラリー内の画像を拡大するシステムの導入
-スクロールすると画像が下からフェードインするシステムの導入
//***NotToDo
//&color(red){やらないこと:何をするかではなく「何をしな...
//&color(red){例:10人以上の会議には出ない。苦手なことは...
~
~
#hr
CENTER:''進捗記録''
//&color(red){最新の情報を一番上に記載して下さい(古い記...
#hr
~
~
**2021.12.22
~
***Webサイトの作成
//https://maya-des.github.io/cool_sample07/
https://maya-des.github.io/cool_sample09/
~
-メニュー表示を削除し、ハンバーガーメニューを導入した。
-画面がゆっくりとスクロールする仕組みを導入した。
~
***イラストの作成
~
|#image(story_19.jpg)||#image(story_20.jpg)||#image(story...
~
|#image(story_22.jpg)||#image(story_23.jpg)|
~
-主人公が寄り道した後に帰宅する場面。寒色系の色を用いて、...
~
***特典イラストの作成
~
#image(sp_right.jpg,,70%)
~
-正しい数字を選択すると特典画像が表示される仕組みを導入し...
~
~
**2021.12.15
~
***Webサイトの作成
https://maya-des.github.io/cool_sample06/
~
-イラストや文字のサイズを変更し、イラストの枠を削除した。
~
***イラストの作成
~
|#image(story_15.jpg)||#image(story_16.jpg)|
~
|#image(story_18.jpg)||#image(story_17.jpg)|
~
-主人公が寄り道する場面。暖色系の色を用いて、前の場面より...
~
***今週の目標
-イラストの作成
-サイト全体のレイアウトの更新
~
~
**2021.12.08
~
***Webサイトの作成
https://maya-des.github.io/summer_cool01/
~
-お楽しみ要素のシステムを導入。
-挨拶文や説明文、イラストや効果音の追加。
~
***イラストの作成
~
|#image(gallery_09.jpg)||#image(gallery_10.jpg)||#image(g...
~
|#image(gallery_12.jpg)||#image(gallery_13.jpg)||#image(g...
~
-主人公が登校する場面。暖色系の色を用いて、前の場面よりも...
~
***プレゼンを通して見つかった改善点
-メインであるイラストのサイズはもっと大きく(絵を魅せる)
-現代的なWebサイトの完成を目標としているので、メニュー表...
-挨拶文も消す?(いきなりストーリーを始めても良い)
-イラストの枠をより細く、目立ちすぎないようにする
-効果音再生アイコンの作成
-より世界観を演出するために、WebサイトそのものにBGMを導入...
~
***今週の目標
-イラストの作成
-サイト全体のレイアウトの更新
~
~
**2021.12.01
~
***Webサイトの試作
https://maya-des.github.io/cool_sample04/
-オープニングアニメーションを導入し、効果音を追加したこと...
-htmlのエラー部分を改善。
~
***今週の目標
-ストーリーに用いるイラストや、特典イラストの作成
-サイト全体のレイアウトの更新
-お楽しみ要素のシステム導入
-ギャラリー内の画像を拡大するシステム導入
-フッターのアドレス変更
~
-プレゼン準備
~
~
**2021.11.24
~
***イラストの作成
~
|#image(gallery_06.jpg)||#image(gallery_07.jpg)||#image(g...
~
-主人公が朝の身支度をする場面。暖色系の色を用いて、前の場...
~
***今週の目標
-ストーリーに用いるイラストや、特典イラストの作成
-サイト全体のレイアウトの更新
-オープニングアニメーションの追加
-お楽しみ要素のシステム導入
~
~
**2021.11.17
~
***Webサイトの試作
https://maya-des.github.io/cool_sample03/
-背景の色や画面サイズを変更。
-お楽しみ要素について説明文の追加。
~
***今週の目標
-ストーリーに用いるイラストや、特典イラストの作成
-サイト全体のレイアウトの更新
~
~
**2021.11.10
~
***Webサイトの試作
https://maya-des.github.io/cool_sample02/
-イラストを追加し、背景の色を変更。
~
***イラストの作成
~
|#image(story_01.jpg)||#image(story_02.jpg)||#image(story...
~
|#image(story_04.jpg)||#image(story_05.jpg)|
~
-主人公がセミの鳴き声で起床する場面。寒色系の色を用いて、...
~
***試作(ラフ)
-[[部屋のラフ>https://drive.google.com/file/d/14hjdJ7T9A5...
寒色系の色を用いて、涼しげなイメージの部屋を表現。
~
***今週の目標
-イラストの作成
-サイト全体のレイアウトの更新
-特典イラストの作成
~
~
**2021.10.27
~
***Webサイトの試作
https://maya-des.github.io/cool_sample01/
~
#image(sitemap_01.jpg,,70%)
~
#image(sitemap_02.jpg,,70%)
~
-ボタンを押すと夏の音が聞こえてくる演出や、動画が再生され...
~
***今週の目標
-イラストの作成
~
~
**2021.10.20
~
***Webサイトの構成ラフ
[[Webサイトラフ1>https://drive.google.com/file/d/19GGCJ-H...
[[Webサイトラフ2>https://drive.google.com/file/d/19H7N4-l...
~
-ストーリーの箇所のみ背景を変更。
~
#image(sky.jpg,,70%)
~
-画面をスクロールすることで、朝→夜へと時間が移り変わって...
~
***今週の目標
-Webサイトの試作
-イラストの試作
~
~
**2021.10.13
~
***ストーリー構成の考案
[[ストーリー構成1>https://drive.google.com/file/d/13aLL-M...
[[ストーリー構成2>https://drive.google.com/file/d/13bUYfT...
[[ストーリー構成3>https://drive.google.com/file/d/13cIix0...
[[ストーリー構成4>https://drive.google.com/file/d/13jxp7C...
-「暑い」という単語を使わずに夏の暑さを表現し、「涼しい」...
-画面をスクロールすることで、朝→夜へと時間が移り変わって...
-お楽しみ(?)要素として、それぞれのイラストに「夏」らし...
~
-グッズは時間に余裕がある場合?研究の後にでも個人用に
~
***キャラクターデザイン
~
#image(character_design.jpg,,70%)
~
-主人公の視点(一人称視点)で物語を進めることで、よりリア...
-主人公は物語の中で会話をしないため、口はあえて描かない(...
~
***メインビジュアルの変更
~
#image(main_02.jpg)
~
-メインビジュアルと実際のWebサイトの内容をリンクさせたも...
~
***今週の目標
-Webサイトの試作
-イラストの試作
~
~
**2021.10.6
~
***メインビジュアルの作成
~
#image(main_01.jpg)
~
-「夏」の概念が詰まった郵便物をイメージ。
~
***試作(ラフ)
-[[グッズラフ>https://drive.google.com/file/d/10l3USi1Tpw...
Webサイトに用いたイラストをモチーフにしたグッズを製作する...
-[[Webサイトラフ>https://drive.google.com/file/d/10p3MPYA...
主に色合いを工夫し、涼しげな印象を与えるWebサイトを作成す...
~
***今週の目標
-ストーリー構成の考案
-キャラクターデザイン
-Webサイトの試作
-イラストの試作
~
~
**2021.9.29
~
***テーマの決定
-「夏のクール便(ひんやり瓶)」:夏の概念がたくさん詰まっ...
-WordPressではなくGitHubを用いる?
~
***調査
-シンプルな作りのWebサイト(URL:https://demos.freehtml5....
-オープニングアニメーションの取り入れ方(URL:https://www...
~
//***試作(グッズのラフ)
//-Google Driveのリンクを貼る
//~
***今週の目標
-メインビジュアルの制作
-Webサイトの試作
-イラストの試作
~
~
**2021.9.22
~
***概要(テーマのメモ)
-イラスト×アニメーション×Webサイト:「概念的な夏」「セー...
-イラスト×グッズ:Webサイトに用いたイラストをモチーフにし...
~
***調査
-オリジナルグッズ(URL:https://shopzokuzoku.thebase.in/...
-アニメーションを取り入れたWebサイト1※音が出ます(URL:ht...
-アニメーションを取り入れたWebサイト2(URL:https://es-ci...
-物語が展開していくWebサイト1(URL:http://yourpower.pand...
-物語が展開していくWebサイト2(URL:https://thebearandhis...
-日記風のWebサイト(URL:https://monokai.nl/2019/japan/)...
-ストーリーテリングを導入したWebサイト(URL:http://lette...
~
***今週の目標
-テーマの決定
-イラストやグッズ(ラフ)の試作
~
~
**2021.9.15
~
***概要(テーマのメモ)
-イラスト×アニメーション×Webサイト:「概念的な夏」「セー...
~
***使用するツール
-ibisPaint X
-Adobe After Effects
-WordPress
~
***調査
-セーラー服について(URL:https://www.schoolwear-shop.com...
-WordPressでgifアニメーションを取り入れる方法(URL:https...
-個人的に好きな構成のWebサイト(URL:https://es-cinnamon....
~
***卒業研究に向けての長期的な目標
-3年生(情報デザイン研究)では主にイラストの作成やそれを...
-4年生(卒業研究)では主にセーラー服をモチーフにしたグッ...
~
***今週の目標
-テーマの決定
~
~
~
~
ページ名: