#author("2026-05-07T02:05:23+09:00;2026-05-07T01:45:01+09:00","default:member","member") #author("2026-05-07T09:13:01+09:00;2026-05-07T01:45:01+09:00","default:member","member") *Éclune 自分に適したスキンケアが見つかるサイト ・・・・・・・・・・・・・・・・ #image(mein.png) -''芦谷 心渚'' -'''Keywords：スキンケア, 清潔感''' -[[ここからサイトへ>https://kokkoashishi.github.io/index/]] //-__[[相互評価シート>https://www.example.com]]__ ← ここからコメントをお願いします。 ~ //***CONTENTS //#contents2_1 //~ **概要 ***これは何？ 肌悩みに応じたスキンケア商品をわかりやすく提案するWebサイト。 ~ ***背景と目的 私は混合肌であり、乾燥や皮脂など複数の肌悩みを抱えていた。そのため、自分の肌状態に合ったスキンケア商品を選ぶのに時間がかかる。 また、インターネット上には多くのスキンケア情報やレビューが存在するが、広告などもありどの情報が自分にとって適切か判断しにくいという問題もある。 そこで、同じように複数の肌悩みを持つ人でも、状態に応じて信頼できる情報(友人・自分の感想)をもとに、素早くスキンケア用品を選べるサイトを作りたいと考えた。 私自身混合肌であり、乾燥や肌荒れなど複数の肌悩みを抱えていたので、自分の肌状態に合ったスキンケア商品を選ぶのに時間がかかったりした。 また、インターネット上には多くのスキンケア情報やレビューが存在するが、広告などもありどの情報が自分にとって適切か判断しにくいという問題があると感じている。 そこで、同じように複数の肌悩みを持つ人でも、状態に応じて信頼できる情報(実際に使った友人・自分の感想)をもとに、素早くスキンケア用品を選べるサイトを作りたいと考えた。 ~ ***コンセプト わかりやすく・清潔感をコンセプトとする。情報を見やすく整理し、誰でも迷わず使用できるようにする。また、スキンケアサイトにふさわしい清潔感のあるビジュアルを重視する。 ~ わかりやすく・清潔感があるWebサイト ***成果物の仕様 -サイトマップ・ワイヤーフレーム |#image(サイトマップ.jpg)|#image(IMG_9705.png)| ~ ***制作ツール VisualStudioCode ・アイビス ~ ***プロジェクトの期間 2026.04.09～ ~ ***まとめ //&color(red){プロジェクトが完結したら「まとめ」を記載して下さい。}; ~ ~ **調査 ***現状調査 現在、多くのスキンケアに関するサイトが存在するが、情報量が多く、自分に合った商品を見つけるまでに時間がかかるという課題がある。また、専門用語が多く、初心者にはわかりにくい場合も多い。 ~ ***先行事例 -[[アットコスメ基礎化粧品レビュー>https://www.google.com/url?sa=t&source=web&rct=j&opi=89978449&url=https://www.cosme.net/categories/item/800/review/&ved=2ahUKEwiT5cb8pvGTAxXnl1YBHa_vCA8QFnoECA4QAQ&usg=AOvVaw19SpgCHq2f9T3yGOkmkNmD]] -[[リップス レビュー>https://www.google.com/url?sa=t&source=web&rct=j&opi=89978449&url=https://lipscosme.com/&ved=2ahUKEwiT5cb8pvGTAxXnl1YBHa_vCA8QFnoECB0QAQ&usg=AOvVaw1Wj_b9CDy3DWcmfGxs94o6]] これらのサイトは情報量が豊富である一方、個人の肌質に特化した簡単な提案機能は少ない傾向にある。 個人・友人のレビューでは不足している情報量はここから補い、レビューを見ておすすめと思う商品と、個人・友人からのレビューを聞いておすすめする商品の欄を作り、分けて表示する。 ~ ***技法・技術情報 ・HTML / CSS / JavaScriptを用いたWeb制作 -[[サイト参考>https://sankoudesign.com/category/unique/]] -[[サイト参考>https://81-web.com]] -[[サイト参考>https://liginc.co.jp/416443]] ~ ~ ~ **プロジェクト管理 ***スケジュール -[[スケジュール>https://docs.google.com/spreadsheets/d/1YFqx9KcwV1FrMqftRQ_-XDSBsdIuq299/edit?usp=sharing&ouid=114514119927695828299&rtpof=true&sd=true]] ~ ***ToDo //&color(red){やるべきこと（タスク）を箇条書きにします。}; //***NotToDo //&color(red){やらないこと：何をするかではなく「何をしないか」を考える}; //&color(red){例：10人以上の会議には出ない。苦手なことは誰かに頼む・・}; ~ ~ #hr CENTER:''進捗記録'' #hr ~ ~ **2026.04.30 ***ワイヤーフレーム #image(IMG_9705.png) スケジュールの作成 ウェブサイト制作中 **2025.04.23 ***サイトマップ #image(サイトマップ.jpg) 来週までに サイト制作に取り掛かる ~ **2025.04.16 ***📌 テーマ 肌悩み別スキンケアの選び方 ~ ***内容 肌悩みを聞いて自分が何肌になるのかわかるようにする（診断表を作成） レビューを見て評価したスキンケアを肌悩み別にまとめる 自分が使ってきた商品正直レビュー 検索がかけれるようにする 清潔感のあるビジュアル ~ ***現場調査 -[[アットコスメ基礎化粧品レビュー>https://www.google.com/url?sa=t&source=web&rct=j&opi=89978449&url=https://www.cosme.net/categories/item/800/review/&ved=2ahUKEwiT5cb8pvGTAxXnl1YBHa_vCA8QFnoECA4QAQ&usg=AOvVaw19SpgCHq2f9T3yGOkmkNmD]] -[[リップス レビュー>https://www.google.com/url?sa=t&source=web&rct=j&opi=89978449&url=https://lipscosme.com/&ved=2ahUKEwiT5cb8pvGTAxXnl1YBHa_vCA8QFnoECB0QAQ&usg=AOvVaw1Wj_b9CDy3DWcmfGxs94o6]] -[[肌診断>https://www.google.com/url?sa=t&source=web&rct=j&opi=89978449&url=https://www.ayaka-ch.jp/web-diagnostics/&ved=2ahUKEwi2id3fqPGTAxXjna8BHb36KJ4QFnoECA0QAQ&usg=AOvVaw3w5EYGNl9kqfuZxAS-9lyy]] -[[肌悩み診断>https://www.google.com/url?sa=t&source=web&rct=j&opi=89978449&url=https://www.typology.jp/diagnostic%3Fsrsltid%3DAfmBOooly8jtFrBpgu0jP2rIjhsUb6XVaROXdtelZSeNJmpEz-b2L-GV&ved=2ahUKEwi2id3fqPGTAxXjna8BHb36KJ4QFnoECCMQAQ&usg=AOvVaw1WAeir-A4_KZcky9UaRTri]] -[[配色参考>https://www.iroazayaka.com/color-sample/]] -[[サイト参考>https://sankoudesign.com/category/unique/]] -[[サイト参考>https://81-web.com]] -[[サイト参考>https://liginc.co.jp/416443]] ~ ***技法・技術 Illustrator、VisualStudioCode、 ~ ***試作 ~ **2026.04.09 ***制作案 -肌悩み別スキンケアの選び方 -花札の始め方 -パーソナルカラー別ファッションの色の組み合わせ方 -自分のための架空化粧品ブラントを立ち上げる -アーケードゲームの歩き方 -「自分に似合う髪型」の見つけ方（前髪・後ろ髪・ヘアアレンジ・カット・ヘアカラー） -コールセンターが教える「初対面で何話すか」会話サポート -雨の不快感軽減 -梱包送料まとめ（メルカリ入門） -電子レンジの時間早見サイト ~ ***全体的なビジュアル -一目に入る色を三色までにする -視認性を上げる ~ ~ ~