LogoMark.png

鹿毛鈴菜/情報デザイン研究II の変更点


#author("2021-10-27T15:24:05+09:00","default:member","member")
#author("2021-10-27T16:26:33+09:00","default:member","member")
#image(withthe.png)
𝗪𝗲𝗯𝗦𝗶𝘁𝗲・・・・・・・・・・・・・・・・ 
-''鹿毛鈴菜''
-'''Keywords:webサイト, ブランディング'''
-https://genews2001.wixsite.com/withthe-site

~


**概要
***これは何?
前期ブランディングしたものをブラッシュアップして、さらにwebサイト制作に取り組む
//&color(red){これは何か・・を簡潔に};
~

***背景と目的
//&color(red){プロジェクトの背景と目的};
今日において、ショップの運営や紹介のためのウェブサイトは必需品であると思ったため
~

***コンセプト
-ブランドの雰囲気が伝わりやすいデザイン性のあるwebサイト
//&color(red){基本的な考え方、枠組み、視点など};
~

***成果物の仕様
-動きのあるページにして、インパクトを残し、ブランディングしたコンセプトが伝わりやすいものにしたい
//&color(red){&small(成果物の形式・サイズ・時間尺等);};
~

***メンバー
鹿毛鈴菜
//&color(red){共同プロジェクトの場合のみ|メンバーと役割分担を明記};
~

***制作ツール
-Illustrator
-WordPress
-
//&color(red){使用するツール|ハードウエア・ソフトウエア};
~

***プロジェクトの期間
//&color(red){プロジェクトの期間|20XX.XX.XX - 20XX.XX.XX };
~

***まとめ
//&color(red){プロジェクトが完結したら「まとめ」を記載して下さい。};
~
~


**調査

***現状調査
-現在コロナウイルスの流行で、急速なオンライン化や、直接お店に足を運べないなどの理由から、webショップ、webサイトの需要が高まっています。そんな時、商品の雰囲気やコンセプトをうまく伝えるためにはやはり、そのwebサイトの外観や文字などの細部へのこだわりなどが必要になってきます。
-現在コロナウイルスの流行で、急速なオンライン化や、直接お店に足を運べないなどの理由から、webショップ、webサイトの需要が高まっている。そんな時、商品の雰囲気やコンセプトをうまく伝えるためにはやはり、そのwebサイトの外観や文字などの細部へのこだわりなどが必要である。
-[[PERPANEP>https://www.kokuyo-st.co.jp/stationery/perpanep/]]
--色味が統一されていて、コンセプトがわかりやすい
-
-
//&color(red){プロジェクトのテーマに関わる社会の現状と問題の洗い出し};
~

***先行事例
--[[𝟏𝐠𝐮𝐮>https://1guu.jp]]
--[[𝐛𝐨𝐛>http://worldbpb.com/product/list.html?cate_no=90]]
--[[𝐥𝐚𝐤𝐚>https://en.laka.co.kr]]
//&color(red){プロジェクトのテーマに該当する先行事例の紹介、傾向分析など};
~

***技法・技術情報
-情報デザイン演習ⅢA
//|48|4|48|c
//|#YouTube(XbMLnYGL2TA)||#youtube(jxIpYOOh-TU)|

//&color(red){プロジェクトの遂行に必要な技法・技術に関する調査};

~
~

**プロジェクト管理

***スケジュール
-[[スケジュール📅>https://docs.google.com/spreadsheets/d/1qp0L6gTGyD4Nz01-aEO3ZVmwEmQnDNjVP2kbxG70bbo/edit?usp=sharing]]
//&color(red){計画的な遂行のために、進行管理表を作成してリンクして下さい。};
~

***ToDo
-試作を繰り返す
-デザインを随時見直す
//&color(red){やるべきこと(タスク)を箇条書きにします。};
//&color(red){完了後は「%%取り消し線%%」あるいは「// コメントアウト」」};


***NotToDo
//&color(red){やらないこと:何をするかではなく「何をしないか」を考える};
//&color(red){例:10人以上の会議には出ない。苦手なことは誰かに頼む・・};

~
~

#hr
CENTER:''𝗪𝗼𝗿𝗸𝗶𝗻𝗴''
//&color(red){最新の情報を一番上に記載して下さい(古い記事が下へ沈む)。};
#hr
~
~

~
**2021.10.27
***試作
~
-[[wix>https://genews2001.wixsite.com/withthe-site]]
-次回からはWordPressに移行します

**2021.10.20
***試作
~
-[[wix>https://genews2001.wixsite.com/withthe-site]]
~
**2021.10.13
***試作
~
-[[xd>https://xd.adobe.com/view/4dde1885-7743-46ad-8674-9622cc57ef7a-188d/]]
#image(wtxd.jpg,center,40%)
**2021.10.6
~
~
webサイト作成について詳しくないので調べてみます
~
***作成方法を考える
-アニメーションを取り入れるならCSSもしくは、JavaScriptを使った2つの方法が主流
~

~
***CSS
-まずCSSは、画面上で何かアニメーションをシンプルに動かしたい場合に使用します。
例えば、文字の大きさや色を変えたり、配置や背景を変更したり。
ホームページにとりあえず何か動きをつけたい場合は、一番手軽な方法です。
~
~
***JavaScript
-対してJavaScriptは、アニメーションを細かく制御したい場合に使用します。
例えば、停止、一時停止、巻き戻し、バウンス、スローダウンなど。
手間はかかりますが、その分ユーザーのアクション合わせてアニメーションの効果を細かく設定できるので、クオリティの高いアニメーションを作ることができます。
~

**2021.9.29
***shopwebサイトについて
-web上での買い物は実際に触れたり見たりすることができないため、サイト上のみで「この商品が欲しい」と思わせて「購入」してもらわなければならない。そのためには、良いサイトのデザインが大切になってくる。
~
-重要な3つのポイント
--全体的に見やすい
--商品が買いやすい
--商品のイメージに合っている
~
[[参考ページ>https://shop-pro.jp/yomyom-colorme/28529]]
~
**2021.9.22
***調査
-参考サイトや気に入ったサイト
--[[𝟏𝐠𝐮𝐮>https://1guu.jp]]
--[[𝐛𝐨𝐛>http://worldbpb.com/product/list.html?cate_no=90]]
--[[𝐥𝐚𝐤𝐚>https://en.laka.co.kr]]