LogoMark.png

豊田祥歩/情報デザイン研究I の変更点


#author("2021-08-05T10:54:10+09:00;2021-08-04T16:38:58+09:00","default:member","member")
*hanafuri
ハンドメイドブランドのWebサイト制作

#image(hand.jpg);

-''Toyota Akiho''
-'''Keywords:handmade, web design'''
-http://normal.html.xdomain.jp/hanafuri
-[[Presentation>豊田祥歩/PresentationPage]]

~


**Overview
***Introduction / What is This
//これは何か・・を簡潔に
自身のハンドメイドブランドのプロデュース及びWeb制作
~

***Background
-近年ハンドメイドアクセサリーが流行するなかで、リボンを使用したアクセサリーはレジンなど人気のものに比べて種類が少なく、似た商品が多い。
-Webサイトを販売に利用している人は少なくハンドメイドの販売アプリが主流である。しかし、販売アプリでは販売ページのテンプレートが存在するため情報量や見せ方が制限される。また、商品を販売することが目的であるため、見て楽しむ要素が少ない。


▶︎今までにない新たな形としてリボンフラワーを使用したアクセサリーの制作、またアクセサリーを購入することだけが目的ではない、見るだけでも楽しめるwebサイトを制作しようと考えた。

//プロジェクトの背景と目的
//ハンドメイドアイテムを販売する際、多くの人がSNSや販売アプリを利用しているが個人のwebサイトを持つ人は少ない。また、販売アプリの多くは販売ページのテンプレートが存在するため情報量や見せ方が制限される。そこで、SNSや販売アプリ以上にブランドの雰囲気を感じてもらえるようなwebサイトやロゴを使用したパッケージを制作しようと考えた。

//''ハンドメイド制作''
//リボンテープを使用してリボン以外のアイテムを作りたいと思い、リボンフラワーを軸に制作しようと考えた。
//リボンフラワーを使用したアイテムの多くは飾り用やギフトアイテムとして販売されており、アクセサリーとしての数はまだ少ない。また派手で幼い印象を受けるものが多く普段使いしにくいため、若い女性にも気軽に使ってもらえるアクセサリーを制作したいと考えた。
~

***Purpose
-新しい形のリボンアクセサリーを制作し、アクセサリーの種類や客層の幅を広げる。
-サイトを訪れた人にリボンフラワーの存在や魅力を知ってもらう。


//webサイトやロゴなどを作ることでブランドとしてのアイデンティティを確立する。また、サイトを訪れた人にリボンフラワーアイテムのことを知ってもらい、購入したいと思ってもらう。
//ハンドメイド作家が個人サイトを持つことのメリットを提示することを目的とする。
~

***Concept
//基本的な考え方、枠組み、視点など
''ブランド名''
''「hanafuri」''
-アクセサリーのモチーフを分かりやすくするため「花」という単語を使用。
-花びらがふわりと舞う様子やリボンのフリフリとしたイメージを込めて「hanafuri」とした。
-柔らかく軽やかな印象を与えるためローマ字表記を採用した。
~

''コンセプト''
''「なんでもない日をちょっとイイ日に。」''

-身に着けるだけで少し気分が上がり、自然と笑顔になれるようなアイテムを目指す。
-リボンは安価でコストが低いため気軽に購入しやすい。また、レジンなどが流行する中でリボンフラワーのアクセサリーは数が少ない。そこで、上記の調査結果にある「かわいくて手頃、人とかぶらないアクセサリー」という部分にスポットを当てる。
-メインターゲットには10代から20代の若い女性を設定する。
~

''Webサイト''
-販売はminneのページで行うためサイトはminneへのリンクを貼る程度。
-購入が目的でなくてもサイトを見るだけで楽しめるものを目指す。(「かわいい」「こんなのあるんだ」)
-minneには載せないようなイラストや写真をたくさん使う。

~

***Output
//成果物の直接掲載またはリンク誘導
//プロジェクトの途上では、試作品等、視覚的な資料を掲載・リンクして下さい。
//成果物の形式・サイズ・時間尺等の基本情報も記載して下さい。
Webサイト(購入はminne)
ロゴ
アクセサリー
~

//***Member

***Tools
//使用するツール|ハードウエア・ソフトウエア
-HTML , CSS
I-llustrator , Photoshop
-Procreate
~

***Term
//プロジェクトの期間|20XX.XX.XX - 20XX.XX.XX
4年前期
~

***Conclusion / Summary 
//プロジェクトが完結したら「まとめ」を記載して下さい。
~
~


**Survey

***Present Status
//現状調査、現状の問題の洗い出し
-ハンドメイドアイテムの販売はminneなどの販売サービスとSNSの併用が主流であり、個人サイトを持つ人は少ない。
~

***Precedent
//先行事例の紹介、傾向分析など
-末崎日菜子先輩の卒業研究
[[研究ページ>http://design.kyusan-u.ac.jp/socialdesign/?%E6%9C%AB%E5%B4%8E%E6%97%A5%E8%8F%9C%E5%AD%90/%E5%8D%92%E6%A5%AD%E7%A0%94%E7%A9%B6II]]
[[うつろい>http://utsuroi.main.jp/]] &small{完成サイト};
&small{自身のハンドメイドブランドのWebサイトやプロモーション映像などを制作されている。};
~

***Technique / Technology
//プロジェクトの遂行に必要な技法・技術に関する調査

~
~

**Project Management

***Schedule
[[進行管理表🗓>https://docs.google.com/spreadsheets/d/1SYSZphBEqLw03Efbe3KT0earK9yjAXVWvWzuVbQqqZc/edit?usp=sharing]]
~

***ToDo
//「%%取り消し線%%」あるいは「// コメントアウト」
-コンセプト固める
-ショップ名決める
-ロゴ制作

~
~
~

#hr
CENTER:''worklog''
#hr
~
~
**2021.08.03
***web
-サイトイメージ
#image(siteimage.jpg,,50%)

-イラストや写真を使う。
-シンプルだけど、可愛らしくふんわりしたイメージ。

~
~
**2021.07.12
***web
-シングルページ で制作する。
-[[Workflow>https://design.kyusan-u.ac.jp/OpenSquareJP/?WebDesign/Workflow]]
(&small(OpenSquareJP);)
~

-ワイヤーフレーム
#image(wireframe.jpg,,50%)
~

-写真はクリックで拡大。
-写真の下にリンクを貼ってそのままminneに飛ぶ仕様。

-商品を3パターンぐらいに分ける。
--種類で分ける(アクセサリー、飾り物、アレンジメント)
--アクセサリーに限定した種類で分ける(指輪、イヤリング/ピアス、髪飾り)
--花のタイプで分ける(小花、大ぶり、蝶)、(小花、柄物、蝶)
--可愛さの種類で分ける(とびきりかわいい、少しシンプル/大人っぽい?)

~
-制作するときは全体の背景色をつけて作る。(余白とかが見やすいように)
-最後に色を外す。
~
~

**2021.07.05
***web
#image(sitemap_2.jpg,,50%);
-できるだけシンプルなつくりにする。
-カタログサイト?

-minneとの差別化。
→商品の説明を省く、レイアウトを変える、コンセプト等をより詳しくする、アニメーションを使うなど

~
-&small(小さなお花を背景に散りばめたい。降らせるとか。);
~

-追記:個別ページは作らない。

~
~


**2021.06.11
***対面授業
-何よりもまずWeb制作を進める。
-成果物の大きな外枠を完成させる。

→ロゴの訂正諸々<サイトの型を完成させる

🔗↓
//https://www.agent-grow.com/self20percent/2019/11/11/use-placeholder-com/

~
***web
-イメージしていたレイアウトが実際に販売するminneと差別化できていなかったので練り直し。
-''見る''ことに特化したカタログサイトにする?
-不揃いなタイル状に写真やイラストをバーっと並べてみるとか。
→写真の中にちょっとしたイラストが混ざると可愛いと思った。
→イラスト描く余裕あるかどうか


-見て楽しい可愛いと感じるサイト
-商品ごとの説明等はminneのページでできる。
→販売ページには記載しないような(豆知識みたいな)情報をサイトに入れ込んで見る?

🔗↓
//https://www.agent-grow.com/self20percent/2019/11/11/use-placeholder-com/
//コーディング時のダミー画像

~
~
**2021.06.10
***中間報告
''web''
-サーバーの確保
-minneとの差別化。役割の分担。カタログとか。

~
-''情報デザイン研究の方はWeb制作を中心にする。''


~
~
**2021.06.01
***ブランド
''名前''
ショップ名を『はなふわり』としていたが、もっとしっくりくる名前があるような気がして再考中。名前を見た時、聞いた時、口に出した時に「かわいい!」と思えるようにしたい。
~

候補①:『フリフラ』
-''花''という単語をそのまま使おうと考えていたが、一旦やめて可愛いに全振りした。
-一応フリルとフラワーから取った。
-語感重視。
~
候補②:『hanafuri』
-最初のはなふわりとフリフラを合わせてみた。
-ひらがなやカタカナがいいと思っていたけど、ローマ字表記がいちばんかわいい。
-素直に読めるものであればローマ字でもアリだと思った。

~
''コンセプト''
-ふんわりとしたイメージは頭にあるもののうまくまとまらない。

~
&small{🖋ワード(思いついたまま)};
-&small{枯れない、色褪せない、いつもそばにある、かわいい、ときめく、気持ちが明るくなる、笑顔、変わらない、咲き続ける};

&small{🖋大事にしたいこと};
-&small{何度見ても必ず自然と笑顔になれる。「あっ、かわいい☺️」};



~
~
**2021.05.20
***ブランド
''名前(仮)''
『はなふわり』

-ローマ字表記の名前が多いので、一覧で見た時に目に入りやすいようにひらがなやカタカナがいい。
-イメージするブランドの雰囲気には平仮名が一番合っていると思った。

-どんなアイテムがあるか想像しやすくするために''花''という単語をそのまま使用。
-花が舞う様子やリボンの持つやわらかさを''ふわり''というワードで表してみた。

サブタイトルは「リボンのお花屋さん」です。

~
''ロゴ(仮)''
#image(logo.jpg,,50%)

~
~
**2021.04.22
***名前案
🌼キーワード:花

①はなのひ
&small(漢字にすると花の陽。晴れの日みたいにぽかぽかする感じ);
&small(まるっこい平仮名でやわらかく);
&small(少し言いづらい?);

②花日和
&small(①と似たイメージの名前。こちらは漢字。);

③花ふわり(はなふわり)
&small(かわいらしい感じ);
&small(リボンのヒラヒラフリフリな感じと花びらがふわっとする感じを合わせて、ふわり。みたいな...);
&small(結構こじつけ?);
~
-&small(まだいろいろ考え中);
-&small(アニメなどのタイトルであるような、ひらがなとカタカナの組み合わせが響きが良くていいなとも思う。ひだまりスケッチとかめだかボックスとか。);
~
-&small(パッと見てリボン要素が伝わらない?);
-&small(リボンと言う単語そのままでは使いたくない。けどいい感じの言い換えもない。);
-&small(リボン要素はロゴで?);

~
***調査
''先行事例''
-''Pinterest''
[[📍ロゴ>https://www.pinterest.jp/penpen7124/%E3%83%AD%E3%82%B4/]]
~
-いいなと思ったものを保存。
-イメージがリボンとお花がつながっている感じだったので、線がメインのロゴが参考になると思った。
-線だけだと大事にしたい温かさが伝わりづらいかなと思ったので、線だけではないロゴやお花のイラストなども。
~
-サイトや商品の写真などで世界観が伝わればロゴはシンプルでも問題ない



~
~
**2021.04.21
***コンセプト
''ブランドイメージ/キーワード''
-温かい感じ。ぬくもり。安心感?
-明るい気持ちになれるような。
-カラーはオレンジ🍊。陽気で活発な印象の色。
-洗練されすぎないイメージ。幼さやチープ感?
~

''ターゲット''
-メインターゲットは女性。癒しや可愛いものを求めている人。
-&small(ギフト系のアイテムなども考えているので、女性に限らず見てもらいたい。);
-&small(小さな子向けのアクセサリーなんかも作ってみたい。(親向け?));
&small(欲張りすぎ?);

~
📍女性らしさや上品さよりも、花や贈り物・小さい子に感じるような
心がほっとする温もりを大事にしたい。

~
~
***制作物として考えているもの
-ロゴ
-ショップカード / ポストカード
-簡単な包装までできたらいいな。
-&small(↑ちょっとしたラベルシールぐらいのものもアリ?);
-&small(商品に封入する書類等も統一されたデザインで印刷したい);

~
~
**2021.04.15
***テーマ
-グラフィック / VI
-ハンドメイドサイト(ショップ)のロゴなどのデザイン
&small{卒業研究でやる内容と紐づける};

&small{''キーワード''};
&small{ブランディング?};
&small{プロデュース?};

~
***調査
''先行事例''
-''Pinterest''
[[📍ロゴ>https://www.pinterest.jp/penpen7124/%E3%83%AD%E3%82%B4/]]
[[📍VI>https://www.pinterest.jp/penpen7124/vi/]]
&small{🔍"VI" "アイデンティティーデザイン" "ブランディングデザイン"};

~
🎀一目でリボンテープだと分かってイイなと思う。
#image(リボンロゴ.gif,,25%)
&small{画像元:[[LOGO TANK>https://logo-tank.net/detail/?logo_id=4495]]};

~
🔗
//[[リボン/イラレ>http://lab.gpol.co.jp/graine/2011/12/photoshopillustrator.php]]
//[[記事>http://illustrator-labo.com/?p=218]]

~
~

~