#author("2020-12-05T03:32:32+09:00","default:member","member") *Night Dream -icon maker- クラシックファッションをテーマとした女性向けアイコンメーカーの制作 '''Keywords：illustration / Web / icon maker''' ~ #author("2023-06-25T20:40:48+09:00","default:member","member") #image(Top.jpg,center,70%) [[Webサイト>http://ray7.html.xdomain.jp/NightDream/]] ~ ~ ~ **研究の背景・目的 ~ |#image(SNS.jpg,center,70%)|#image(SNS2.jpg,center,60%)| [[ICT総研｜市場調査・マーケティングカンパニー>https://ictr.co.jp/report/20181218.html]] ~ -近年、ネットの情報によると日本国内においてのSNSの普及率が約８０%であった。 -SNSの利用者は年々増加し続けている。 -他の人と被らないように自分だけのオリジナルのSNS用のアイコンを作ることができれば魅力的だと思った。 -これからSNSを使い始める為に必須となるプロフィール画像を似顔絵など自分の好みで顔のパーツをカスタマイズし無料で作れるツールであるアイコンメーカーを自身で制作しようと考えた。 ~ ~ #image(majoriga.jpg,center,80%) 「MAJOLICA MAJORCA×宇野 亜喜良」マジョリ画 株式会社資生堂 #image(agt87_.jpg,center,80%) 「agt87_」強い女メーカー Picrew ~ -「マジョリ画」、「強い女メーカー」などといった女性向けのアイコンメーカーがSNSで短期間において爆発的に話題が広がり多くの人から注目を集めた為、女性向けが需要の傾向があると感じた。 -独立したアイコンメーカーのWebサイトが少ない為、クラシックファッションをテーマとした女性向けのアイコンメーカーのWebサイトを制作。 -クラシックファッションとはヨーロッパ発祥の古くから親しまれている伝統のあるデザインを取り入れた正統派のファッションである。 -シンプルな装いでも「華やか」、「個性的」な雰囲気を持つ為、一連のファッションブランドにおいても取り入れられていることが多く、女性から受け入れられやすいと考えた。 ~ ~ ~ ~ ~ **調査 （１）調査目的 -アイコンメーカーで自分のオリジナルアイコンを作る良さ -利用者がアイコンを作りやすいWebサイトのレイアウト構成 -クラシックファッション のテーマに合わせたデザインを作る為の調査を行った。 ~ （２）調査方法 -アイコンメーカーについて特集しているWebの記事、ネットで公開されているアイコンメーカーを調べる。 -クラシックファッションに基づいた書籍を閲読。 ~ （３）調査結果 |#image(Twitter.jpg)|#image(instagram.jpg)| -SNSはアイコンにより第一印象が決まる為、SNSを始めた際のデフォルトのアイコンだと寂しい印象になってしまう。 -アイコン画像を設定する際、自分の写真をアイコンにすることに抵抗を感じている人は少なくはない為一定数の需要があるという考えに至った。 ~ -自分でイラストパーツ素材を用意さえすれば簡易的にアイコンメーカーが制作できる既存のサイトがあり、そこに作品を投稿されている人が多数であった。 -既存のサイトは広告が付いていることが多い且つアイコンのパーツを選ぶ際のUIデザインが全て統一されている為世界観が確立されにくいと感じた。 -既存のサイトはパーツ選びやしやすい為、レイアウト構成を参考にしつつアイコンメーカーを制作した。 -ヨーロッパの装飾や文様ついての書籍を閲読し分析したところ、花、動物、昆虫といった自然や生物をモチーフとする傾向があった。 ~ ~ ~ ~ ~ **制作 #image(IconMaker.jpg,center,60%) ~ #image(icon2.jpg,center,60%) ~ #image(icon.jpg,center,60%) ~ ***コンセプト -オリジナリティを出すために「クラシックファッション」をテーマに女性向けの独立したWebサイトを制作。 -カスタマイズ性を追求し100個以上のパーツ素材を用意している為、約100兆以上の組み合わせパターンを作ることが可能である。 -ターゲットはこれからSNSを利用するにあたってアイコン画像に困っている10代〜20代の女性、クラシックファッションが好きな人に設定。 -アイコンメーカーのWebサイト名「Night Dream」は現実とは違って自分のありのままの姿だけではなく自分の好みをそのまま表現できる遊び心と欲望を叶えられることができるように決めた。 ~ ***シンボル・ロゴ ~ #image(logo.png,center,30%) -シンボルマークのモチーフとなるモルフォ蝶の羽は実際には無色で「構造色」と呼ばれるもので様々な色彩を見せてくれる。 -自分でアイコンのパーツを選ぶことにより様々な顔が作れるといったカスタマイズ性の追求の意味を込めてモルフォ蝶を選んだ。 -ロゴタイプのフォントはカリグラフィ、スクリプトに分類される「Sigarillos」を使用。 -クラシックのテーマに合わせて伝統的な芸術文字を選んだ。 -華やかな雰囲気を持つカリグラフィ書体はウェルカムボードや招待状に使用されることが多い為、特別感を演出できると考えた。 ~ ~ ~ ~ ~ **まとめ -本研究では複数のSNS、アイコンメーカーについてのWebサイトを調査し考察を行った。 -制作を行っていく際、ヨーロッパの装飾と文様を主に取り扱った参考書を複数閲読し、構成する要素を作品に加えたことによりクラシックファッションのテーマに沿ったアイコンメーカーを制作することができた。 -Webサイト、イラスト制作において技術が追いつかなかった部分もあり予定よりもパーツ素材を用意することができなかった。 -定期的にSNSでの宣伝とアイコンメーカーのパーツの更新を行い、より多くの人に利用してもらえるように活動していきたい。 ~ ~ ~ ~ ~ **プロジェクトで使用するツール ~ ［ 機材 ］ -MacBook Pro -iPad Pro & Apple Pencil -GAOMON PD2200 ~ ［ ソフト ］ -Adobe Illustrator -CLIP STUDIO PAINT EX -Procreate -Atom -FileZilla ~ ~ ~ ~ ~ **参考文献・サイト ~ -海野弘, ヨーロッパの図像 花の美術と物語, 株式会社パイ インターナショナル, 2017. -海野弘, ヨーロッパの装飾と文様, 株式会社パイ インターナショナル, 2013. -マジョリ画 | 面白法人カヤック<https://www.kayac.com/service/client/1442>- -アイコンメーカー <http://furrytail.sakura.ne.jp/ext/iconmaker/> -めぶイカメーカー<https://mebuika.kenkenpa.net/> -Picrew｜つくってあそべる画像メーカー<https://picrew.me/> -似顔絵メーカーCHARAT(キャラット)<https://charat.me/> -パワーストーン大辞典<https://www.gemstone-wiki.com> ~ ~ ~ ~ ~ CENTER:進捗・記録 ~ **2020.12.04 - ~ **2020.11.27 -ロゴを改良化 #image(logo.png,center,50%) ＜変更点＞ - 彩度 -ロゴタイプ -シンボルの大きさ ~ **2020.11.20 -専攻別プレゼンテーション ~ **2020.11.13 -専攻別プレゼンテーション ~ **2020.11.06 #image(main.png,center,70%) -Webサイト用イラスト ~ **2020.10.30 -Webサイト制作 http://ray7.html.xdomain.jp/NightDream/ ~ **2020.10.23 【To Do】 -ワイヤーフレーム、サイトマップの再作成 ~ **2020.10.16 -ヘッダーを上側に表示固定。 -アイコンメーカーページのアイコン画面を左側に固定。 ~ 【 提案 】 -cssを使ってWebサイトをスマートフォン対応させる。 -トップページをロングスクロールにする。 -ハンバーガーメニューを設置する。 ~ **2020.10.09 -仮サイトマップ作成 （変更する可能性あり） #image(sitemap.png,center,100%) ~ -仮トップページイメージヴィジュアル作成 （変更する可能性あり） #image(TopPage.jpg,center,50%) -アイコンメーカーのWebサイトのため、トップページからスタート画面になる。 -スタートボタンを押すとアイコンメーカー生成ページへ移動する。 -モルフォ蝶のロゴに合うように動植物をモチーフとした。 自然・動植物・天然石・ヴィンテージ ~ **2020.10.02 -フリーアイコンの髪、眉毛等の色を変える際の色を決めるために、天然石の色を参考にした。 #image(color.jpg,center,30%) ~ ・天然石の名称 ・16進数 ・RGB値 ~ 【参考サイト】 -[[パワーストーン 天然石 効果 意味 種類一覧 ブレスレット - 楽天市場はな花>https://www.rakuten.ne.jp/gold/nenjyu-hana/stone-dictionary/#color09]] -[[パワーストーン大辞典>https://www.gemstone-wiki.com/]] ~ **2020.09.25 -Webサイトの調整 ~ **2020.09.18 -Zoomミーティング ~