LogoMark.png

松崎菜々実/情報デザイン研究I の変更点


#author("2026-07-02T11:00:35+09:00","default:member","member")
#author("2026-07-02T11:05:11+09:00","default:member","member")
*‘Mel-t’架空コスメ商品ページ
想像上を現実に表現・・・・・・・・・・・・・・・・ 

  
#image(malt.jpg)
 
   
-''松崎 菜々実''
-'''Keywords:化粧品, コンセプト, 想像, 視覚化'''
-https://koma-cos25.github.io/MEL-T/
//-__[[相互評価シート>https://www.example.com]]__  ← ここからコメントをお願いします。

~

//***CONTENTS
//#contents2_1
//~


**概要
***これは何?
空想化粧品の商品webページ
~

***背景と目的
-頭の中で作ったものを実際に表現した作品という先行事例
-想像を具現化したらどうなるかという検証結果
-表現することのハードルを下げるとともに、その楽しさも感じ取ってもらう
~

***コンセプト
-化粧品とサイトのデザインの組み合わせによって視覚的にも刺激があるようなヴィジュアル
-現在のメイクする上で解決しきれていない問題や悩みを解決するデザイン
~

***成果物の仕様
[[webページ>https://koma-cos25.github.io/MEL-T/]]
([[企画書>https://ksumail-my.sharepoint.com/:b:/g/personal/k24as024_st_kyusan-u_ac_jp/IQBj4wfr_Tk3S4-pivuyp6quAQWcjBhsXP7TtbJ58YHUlPo?e=2Zl00M]])
~

***制作ツール
サイト・Visual Studio Code,HTML,CSS
化粧品・Blender,CLIP STUDIO PAINT
~

***プロジェクトの期間
プロジェクトの期間|2026.04.09 -  
プロジェクトの期間|2026.04.09 -2026.12.23  
~

***まとめ
//&color(red){プロジェクトが完結したら「まとめ」を記載して下さい。};
-化粧品のコンセプトと企画に右往左往しすぎて作業着手が遅くなってしまった
-中間報告において、設定が足りてなかったと感じる
-後期も引き続きにはなるが、スケジュールの計画からちゃんと実行していきたい
~
~


**調査

***現状調査
//&color(red){プロジェクトのテーマに関わる社会の現状と問題の洗い出し};
・化粧での悩みについて
[[知恵袋>https://detail.chiebukuro.yahoo.co.jp/qa/question_detail/q13289792368]]
[[note>https://note.com/tamu_fsmd/n/n725a8e963e32]]

~

***先行事例
[[カネボウ化粧品>https://www.kanebo-cosmetics.co.jp/]]
[[資生堂>https://www.shiseido.co.jp/?srsltid=AfmBOooGkRaHE22Nk_o57tu3ArW6Soa-tbpU6sDcdPBJ9oTxXdfo6Qeu]]
[[イヴ・サンローラン・ボーテ>https://www.yslb.jp/?srsltid=AfmBOorMGpua05xA63CXDxPfvyeeaTvKa8xlLw-jrCEmmORbgrDqNWp9]]
[[MIRIMU公式サイト>https://mirimu-official.com]]
~

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

~
~

**プロジェクト管理

***スケジュール
//&color(red){計画的な遂行のために、進行管理表を作成してリンクして下さい。};
~

***ToDo
-%%ピンタレストでデザイン参考資料集め%%
-%%ワイヤーフレーム、サイトマップ制作%%
-%%コスメの設定、コンセプト決定%%
-化粧品のビジュアル決定、cg作成
-web制作


//***NotToDo
作業を先延ばしにしない
~
~

#hr
CENTER:''進捗記録''
//&color(red){最新の情報を一番上に記載して下さい(古い記事が下へ沈む)。};
#hr
~
~
**2026.06.25
-作品概要着手
***商品企画書制作
[[onedrive>https://ksumail-my.sharepoint.com/:b:/g/personal/k24as024_st_kyusan-u_ac_jp/IQBj4wfr_Tk3S4-pivuyp6quAQWcjBhsXP7TtbJ58YHUlPo?e=2Zl00M]]
~
~
**2026.06.18
-作品概要着手
***商品企画書制作
#image(sagyo.jpg)
~
~
**2026.06.11
-作品概要着手
-企画案決定、誰でも自由に使いやすい、パーソナルカラーセットコスメブランド
-パーソナルカラーコスメブランドの[[先行事例調査>https://mirimu-official.com]]
~
~
**2026.06.04
-商品企画練り直し、解決したい問題とそこからの案だし
***感じている問題
-消耗品なのに値段が高く、財布がきつい
-パーソナルカラーがわからない
-色選びが難しい
-チーク、リップなど、部分部分の色同士の相性が悪く、チグハグの顔になってしまうことがある
-種類が多く手数が多いため、時間がかかってしまう
***案だし
-容器をリサイクルメインの素材を使ったお手頃コスメ
-容器の形やデザインを捨てたお手頃コスメ
-パーソナルカラー診断がネットショップと同じところに設置してあるコスメブランド
-相性がいい色でセット売りしてあるコスメ
-相性がいい色の範囲で、ある程度自分の好きな色を選べるセットカスタム
-下地プラスファンデなど、一個にいくつかの機能がある化粧品が多いコスメブランド
~
~
**2026.05.21
***HTML制作
[[ページ>https://koma-cos25.github.io/LUMINE/]]
-項目ごとにページに飛べるように仮ページ追加
-画像は[[Lorem picsum>https://picsum.photos/?utm_source=chatgpt.com]]から仮として追加
~
~
**2026.05.14
***頂いたフィードバックから
-目的の訂正
***HTML制作
-メインページの基本の形を形成
#image(mainpage1.jpg)
~
~
**2026.05.07
***化粧品の詳細決定
-コンセプト・近未来、シルバー系、爽やか
-モチーフ・四芒星、りぼん、軌道線 等
-ブランド名・LUMIO
-仮のイメージ画像をAIで生成
***アイデア出しとデザイン
[[onedrive>https://ksumail-my.sharepoint.com/:f:/g/personal/k24as024_st_kyusan-u_ac_jp/IgATgjQjqTTbSJw1A4VVRcQbAXz19XsAsnIAgVXniQ3pNTk?e=5Eja77]]
-このコンセプトのビジュアル画像を収集
-[[ピンタレスト>https://pin.it/6FOfaPOGl]]
~
~
**2026.04.30
***ワイヤーフレーム、サイトマップ制作
#image(makeflame.png)
#image(makemapre.png)
***タイトル等の記載
-確認と本決定をしながら記入
-学科サイト更新
~
~
**2026.04.23
***お題決定!
-架空の化粧品ブランドのウェブサイト、空想のものを形にすること
***狙い
-web制作の知識をより詳細に習得したい
-自分自身の発想力、デザイン力、表現力をみたい
-できれば、化粧品の画像を3dcgを勉強して表現できるようにしてみたい
-
***手順設定
-コスメの設定、コンセプト決定
-ピンタレストでデザイン参考資料集め
-ワイヤーフレーム、サイトマップ制作
-化粧品のビジュアル決定、cgで作成、またはイラストかAI
-web制作
-発表
***早速、コスメのデザイン、コンセプト案、キーワード
-メイクのモチベ上昇
-コンプレックス解消
-女児心をくすぐる
-プリキュア、セーラームーンぽいデザイン
-ジェンダーレスに則った、シンプルかつスタイリッシュなデザイン
-落ち着く、視覚的刺激が少ないデザイン
-暖色、寒色、テーマカラーの設定
-心も強くする、ロックなデザイン
-寒色、さっぱり、すっきり、爽快、整理整頓
-暖色、癒し、感情の上昇、エネルギッシュ
-心に別世界を作る、排他的なデザイン
***ピンタレストボード
-[[リンク>https://pin.it/6b9xj6q9N]]
~
~

**2026.04.16
***三案の発表方法の確認と吟味
-イベント、円形ギャラリーや、どこか場所を借りて行う
-一人では厳しい。毎日の当番や運び込みなど。
-地元で場所を借りる場合、ターゲット層の限定や、集客が難しい。
-vlogや動画、動画のため、一方的な情報提供になりやすい。
-そもそも設定している内容が、対象者がかなり限られている
-web、経験があるため、手を出しやすい。
***課題の決め方を再思考
-一番学びたいと思っていること。
-より、興味を持って取り組める内容
~
~


**2026.04.09
***調査
-メイク講座(イベント方式)
-メイク動画、私のすっぴんを犠牲にできるかどうか!
-気になる部位だけ見れるWEB形式のメイク紹介ページ
-コンプレックスに向き合う化粧品開発
-コンプレックスに関して、原因解明と解消を手伝うページ、本
-メイク体験、イベント方式
-肌質別おすすめ化粧品 クオリティ、値段比較
-作業捗る、癒されるWebサイト
-コスプレイベント、撮影当日の動きや準備段階のvlog コスプレという趣味への敷居を低くする目的で
-絵文字を全部見てみよう!ジャンルごとにわけ、可愛くて色鮮やかな文章へ促進
***三案の絞り込み
-架空の化粧品開発webサイト
-メイク動画(私のすっぴんを犠牲にできるかどうか)又は、イベント形式のメイク講座、体験
-コスプレイベント、撮影当日の動きや準備段階のvlog 敷居を低くする目的で

~
~

~