LogoMarkWhite.png

酒井菫/情報デザイン前半

MainTitle

SubTitle ・・・・・・・・・・・・・・・・

 

            メインビジュアル、あるいは
            プロジェクトの最新の状態を視覚的に掲載

  

概要

背景・目的

昨年、卒業制作で取り組んだ自身のコスメブランドプロダクツを、Webで実際に通信販売することを仮定とし、どのように表現すれば、商品にこめたUXデザインや使用方法などがわかりやすく顧客に伝えることができるかを学ぶ。

ターゲット

コスメプロダクツに興味がある人
大切な人への贈り物を考えている人
花が好きな人
収集癖がある人







進捗記録




2025.5.12

学んだこと
・github
次までにやること
・Figma作り直す(縦列揃える、文字入れる、プロトタイプ機能をつけるetc...)
・まずはWebサイトに慣れるために、コードができたらgithubにアップロードしブラウザでどう見えるか随時確認する

2025.5.11

Visual Studio Code参考1:https://www.youtube.com/watch?v=auGKppIIV4Y
参考2:https://www.youtube.com/watch?v=Qnd3-PaTILc



GWのToDo

・CSS,HTMLを学ぶ
・一つ試しにWebを作ってみる



2025.5.2

Figmaにてイメージ作成
[https://www.figma.com/design/ZKV9EZH9YAXGoSrLikglKH/%E7%84%A1%E9%A1%8C?node-id=0-1&t=g7ikc7zRon2niIvL-1]

フォント:Googleフォント、モリサワフォント、Adobeフォント



2025.4.21

◯Webサイトの主なつくりかた(2025.4.7参照)
1.戦略
ターゲットに自分の作ったコスメプロダクトを知ってもらい、製品の魅力だけでなくUXとしての良さも伝え、コスメプロダクトの新しい体験価値を見出す
2.要件 サイトマップ参照←進捗としてはここまで

3.構造 具体的に内容を詰めていく
4.骨格 どこにどうまとめるか
5.表層 飾り付け

map.jpg

◯サイトマップ制作での特徴
参考文献;https://www.future-shop.jp/magazine/ec-site-sitemap-creation-procedure

Figmaに慣れていく

2025.4.14

◯制作について
プロトタイプはFigmaにて
生成AI(chat GPTやfirefly)を有効活用

◯参考サイト
SHIRO;https://shiro-shiro.jp/ext/product.html?srsltid=AfmBOoqLrvhf5S-TKcAUXxylAa7ITv2ijEkk5T6BLR42reXimpAaMRgz
ポール&ジョー:https://www.paul-joe-beaute.com
アディクション:https://www.addiction-beauty.com
Floranotisjillstuart:https://www.jillstuartfloranotisjillstuart.com/site/floranotis/c/c20/
Decorte:https://www.decorte.com

2025.04.07

◯Webサイトの主なつくりかた
1.戦略 だれに?どのように?なにを?なぜ?
2.要件 どんな内容をいれる?
3.構造 具体的に内容を詰めていく
4.骨格 どこにどうまとめるか
5.表層 飾り付け

◯Webつくるため、慣れるためには
・figmaを使ってみる(無料、比較的使いやすい)
・大学院のサイトを更新してみる(Webのプログラミングに慣れる)

PAGES

GUIDE

添付ファイル: filemap.jpg 18件 [詳細]
Last-modified: 2025-05-12 (月) 15:14:05