• バックアップ一覧
• 差分 を表示
• 現在との差分 を表示
• ソース を表示
• 伊藤みらの/情報デザイン研究II へ行く。
  • 1 (2023-09-20 (水) 14:20:48)
  • 2 (2023-09-20 (水) 17:20:40)
  • 3 (2023-09-27 (水) 15:58:57)
  • 4 (2023-10-04 (水) 13:46:35)
  • 5 (2023-10-04 (水) 13:46:35)
  • 6 (2023-10-07 (土) 20:35:19)
  • 7 (2023-10-07 (土) 20:35:19)
  • 8 (2023-10-18 (水) 13:54:10)
  • 9 (2023-11-01 (水) 14:16:04)
  • 10 (2023-11-01 (水) 14:16:04)
  • 11 (2023-11-14 (火) 11:34:19)
  • 12 (2023-11-14 (火) 21:36:00)
  • 13 (2023-11-14 (火) 21:36:00)
  • 14 (2023-11-15 (水) 15:33:27)
  • 15 (2023-11-15 (水) 15:54:58)
  • 16 (2023-11-15 (水) 15:54:58)
  • 17 (2023-11-30 (木) 13:29:09)
  • 18 (2023-11-30 (木) 13:29:09)
  • 19 (2023-12-01 (金) 12:03:37)
  • 20 (2023-12-01 (金) 17:41:46)
  • 21 (2023-12-01 (金) 17:45:46)
  • 22 (2023-12-02 (土) 00:41:27)
  • 23 (2023-12-02 (土) 01:32:51)
  • 24 (2023-12-02 (土) 01:32:51)
  • 25 (2023-12-02 (土) 01:32:51)
  • 26 (2023-12-02 (土) 01:32:51)
  • 27 (2023-12-02 (土) 01:32:51)
  • 28 (2023-12-06 (水) 14:28:14)
  • 29 (2023-12-06 (水) 17:07:23)
  • 30 (2023-12-06 (水) 17:07:23)
  • 31 (2023-12-06 (水) 17:07:23)
  • 32 (2023-12-06 (水) 17:07:23)
  • 33 (2023-12-06 (水) 17:07:23)
  • 34 (2023-12-06 (水) 17:07:23)
  • 35 (2023-12-06 (水) 17:07:23)
  • 36 (2023-12-06 (水) 17:07:23)
  • 37 (2024-01-16 (火) 15:08:38)
  • 38 (2024-01-16 (火) 15:08:38)
  • 39 (2024-01-16 (火) 15:08:38)
  • 40 (2024-01-16 (火) 15:08:38)

---

柳川うなぎめしマップ

担当:ワイヤーフレーム、menuアイコン、サイト内記事１本

• 情報デザイン専攻 ３年
• Keywords：地域活性化, 柳川市, Webプラットフォーム
  
  
  

背景と目的

• 背景
  • 元は平成22年に本学の商学部観光学科と芸術学部デザイン学科が協働して行ったものだったが、昨今のインターネットの普及やコロナ後の外国人観光客の増加を受け、紙媒体だけでは更新が難しかったり、外国語に対応していないなどの点が不便になってしまった。

• 目的
  • そこで本プロジェクトでは、マップをリニューアルすることに加え、新たにWEBサイトを作成することで、更新頻度を上げ、様々な人が扱えるようにし、柳川市の持続的活性化に繋げる
    
    

コンセプト

• 柳川市とWebサイトの持続的な活性化を促すために、写真を多くしてお店の魅力を発信する
• 持続的活性化に繋げる
  
  

成果物の仕様

• サイトマップ
  
  
• ワイヤーフレーム
  
  

(検索を除いて)仮置きアイコンとして使用している素材
EXPERIENCE JAPAN PICTOGRAMS

• menuアイコン画像
• うなぎ栄養価記事<うなぎメモ
  
  

メンバー

ソーシャルデザイン学科｜Web制作

• 濱有希子　コンテンツ（リーダー）
• 岩崎貴生　コンテンツ（発表代表）
• 亀田日向　コンテンツ
• 川村洸太　コンテンツ
• 田籠祐貴　コンテンツ
• 伊藤みらの　コンテンツ

• 西山実伶　開発（リーダー）
• 出光美心　開発（発表代表）
• 内藤彩乃　開発
• 中西華子　開発
  
  

制作ツール

Macbook Air
Adobe Illustrator 2023

プロジェクトの期間

2023.12.13 コンテンツ版完成

まとめ

市からのご依頼のため学外の方へ受け渡すための構成であること、コンテンツと開発で班が分かれるため自分本位の構成にはなってはならないこと等、まだ作成途中の段階ではありますが、クライアントやユーザーの存在を第一に意識して行ったプロジェクトになりました。学科サイトと同じ仕様で開発が進められるため、サイトマップをもとに、わかりやすく簡潔な画面構成で、また実現可能かどうかを検討しながら進めました。
現物のマップ完成データを頂いたので、それを基にしてアイコンやUIのデザインなどを再編します。記事の作成も含め、完成までの期間でよりプロジェクトへの理解を深められたらと思います。

調査

現状調査

先行事例

• 文京グルメマップ
• あおざしからり
• TAKAYU♨︎温泉パーラー
  (第一に学科サイトの構成を参考にしています)
  
  

技法・技術情報

これからのWebサイト設計の新しい教科書
【全部教えます！】WEBデザインの作り方紹介！できるまでの流れ-adobe Illustrator-

プロジェクト管理

スケジュール

ToDo

• アイコン作成
• フッター作成
• うなぎ記事作成
• PC版メニュー
• アイコン資料集め
• ブラッシュアップ(11/15迄)
• メインページ再編

---

---

2023.12.06

zoom会議

• 記事の文体
• 字数にとらわれる必要はない
• 書きたい項目があればそれを書く
• それぞれの記事でコンセプト、ターゲット層を決める(要報告)
  観光客、
  若い観光客▶︎若者が行って楽しそうな場所
  今後やること
• メニューアイコン
• 写真の加工
• UIデザインの作成
  
  

アイコン案

①お店一覧②うなぎについて③柳川について

④お知らせ記事⑤アクセス⑥検索ページ
未だ制作中の段階です。
完成マップの雰囲気に近くなるよう丸みを帯びたデザインを想定しています。
うな重・川下りの図案は、柳川にシフトしたwebサイトなので、独自のピクトグラムがあれば面白いのではないかと思い入れています。しかし、わかりやすさという観点で適しているのかどうか考え中です。

2023.12.1

サイトマップ作成

ワイヤーフレームの構成が説明不十分に感じたため、サイトマップを作成しました。

また、作成にあたり検索用ページを追加しました。

2023.11.29

お知らせ・アクセス

※画像二枚目のアクセスをクリックすると、ページ下部のアクセス欄へジャンプします。

• フリー記事ページ(お知らせ欄)の大枠です。学科サイトHOMEの構成と同じで、各店舗がこの１つのページに直接記事を書き込む形を想定しています。
  お知らせとは別にブログ的な呟き欄の案も出ていますが、検討中です。
• メニューに格納されているアクセス(アイコン)は、メインページに羅列されるアクセス情報に直で飛べるリンクを付与する形を想定しています。
  
  

PC版フッター

PC版フッターのアイコン配置例です。
アイコンの補足用テキストの配置案が２案出ていますが、現在検討中です。
▶︎画像一枚目のアイコンの枠内に文字を収める案で決定しました。

2023.11.22

うなぎ記事、柳川記事の親ページ

店舗一覧のレイアウトを流用し、個別記事にジャンプできる仕様を想定しています。

2023.11.20

画像選定レビュー

zoomにて開催

2023.11.15

ブラッシュアップ

2023.11.13

レイアウトビュー

zoomにて開催
※ブラッシュアップ前

店舗個別詳細ページ

メニューのプルダウン▶︎アイコン式採用
仮アイコンに使用した素材
EXPERIENCE JAPAN PICTOGRAMS

店舗一覧▶︎2列採用

記事ページは一本直通から項目別の個別記事へ（検討中）
▶︎1記事3000~4000字の想定のため、記事ページを分けることに決定しました。

2023.11.9

meeting

スケジュール、ワイヤーフレームについて話し合い

• メインビジュアルは有と無の２パターン作成
• 店舗一覧は１列か２列の２パターン作成
• 編集アイコン作成、又素材探し
  
  
  
  

2023.11.8

ワイヤーフレーム進捗状況

ショップ一覧ページ、メニューのプルダウン内レイアウト作成

2023.11.1

中間報告を受けて

ワイヤーフレームの構成を変更

進捗状況

ワイヤーフレーム(制作中)

• スマホに移しサイズ感を確認しつつ制作
  
  
  
  

2023.10.25

役割決め
※病欠のため自宅で制作開始
ワイヤーフレームラフ
先にモバイル用サイトのデザイン制作
幅：360

• ハンバーガーメニュー挿入
• トップボタン挿入
• pukiwikiの仕様のため、ワイヤーフレームは1案▶︎並びをどうするか考え中
  
  
  
  

2023.10.18

サイトマップの項目洗い出し

ワイヤーフレームの作成

2023.10.11

Webデザインのアイデア

あおざしからり
TAKAYU♨︎温泉パーラー

• *2023.10.04

PukiWikiについて

• PukiWikiとは
  オープンソースのWikiソフトウェア。
  プラグインが豊富で、skinにより見た目の変更が可能。
  
  
  
  

2023.09.27

第一回説明会

• CMS
• PukiWiki

2023.09.20

制作相談

テーマ案

• 室内用小型コンポストを中心とした、室内プランター栽培の提案と研究　▶︎ハーブ、スパイス栽培を想定
• インテリアにもなるおしゃれな掃除用品ブランド
• 狭いキッチン収納提案
• 絵描きのためのツール
• Webサイト制作
• 柳川うなぎめし
  
  

先行事例

文京グルメマップ

• ジャンル・エリア・最寄駅別にカテゴライズされており検索性が高い。
  
  
  
  
  

アクセスメモ

博多から西鉄柳川駅

博多駅ー(鹿児島本線)ー春日駅　春日駅ー(西鉄大牟田線)ー西鉄柳川駅(1時間半)
博多駅ー(空港線)ー天神駅　西鉄天神駅ー(西鉄天神大牟田線)ー西鉄柳川駅(1時間半)
博多駅ー(七隈線)ー薬院駅　薬院駅ー(西鉄天神大牟田線)ー西鉄柳川駅(1時間半)

うなぎメモ

• 天然、養殖で栄養価に違いはない
• うなぎのアミノ酸スコアは97
  
  
  
  

---

ビタミンA
レチノール、レチナール、レチノイン酸の総称で、脂溶性ビタミンの一種。
うなぎに含まれる成分で最も多く、肉には100g中2400µg、肝臓には100g中4400µg含まれる。
不足すると、眼の暗順応(明るい場所から暗い場所へ移った時に目が慣れるまでの反応)が鈍くなり、夜盲症を引き起こす。進行すると、失明につながる恐れもある。眼や皮膚の乾燥、粘膜の免疫力の低下などの症状もみられる。
レチノールにおいては過剰摂取による問題もあり、急性と慢性の中毒症状がみられる。特に妊婦では胎児の形成に影響を及ぼす性質が確認されているため、必要量と上限摂取量を把握しておく必要がある。
※サプリメントによる過剰摂取が起こりやすいとされる。
１日の成人の推奨量は、男性で850~900㎍、女性で650~700㎍、耐容上限量は2700㎍。


ビタミンB2
水溶性ビタミンだが、水に溶けにくい。体内に蓄積されず、大量摂取による過剰症は起こらない。


アミノ酸
タンパク質の構成成分。中でも体内で生成ができない9種類は必須アミノ酸とされる。


アミノ酸スコア
たんぱく質に含まれる必須アミノ酸9種類のバランスを、最高100とし評価したもの。


脂溶性ビタミン
水に溶けにくく、油に溶けやすい。尿中に排出されず肝臓や脂肪に蓄積されるため、過剰摂取すると身体に悪影響を及ぼす。

---

参考

養殖ウナギの脂質栄養成分
おさかな栄養学
保健・医療・福祉のための栄養学
一生役立つ　きちんとわかる栄養学
数字でわかる、うなぎの優れた栄養バランス
うなぎが高齢者の栄養不足に効く？効能や摂取時の注意点

記事本文

編集中です。


うなぎは夏バテ解消や滋養強壮の効果があるとされています。
実はうなぎには、老化予防や血管系の病気の予防などの効果もあるのです。

そんなうなぎに含まれる栄養素を一つずつ見ていきましょう。


ビタミンA
うなぎに含まれる栄養素を代表するのがビタミンAです。ビタミンAには、目の健康を保つ働きがあります。網膜上にある、暗い場所で働くロドプシンという物質はこのビタミンAで構成されています。不足すると、薄暗い場所で明暗を見る力が鈍くなり、夜盲症を引き起こす恐れがあります。
また、免疫力・防御力アップにも不可欠です。のどや鼻などの粘膜に潤いを与え、菌やウイルスが体内へ侵入するのを防ぎます。
ビタミンAは排出されず体内に蓄積されるため、過剰摂取には注意が必要です。

ビタミンA：目の健康・風邪予防

ビタミンB1
糖質をエネルギーに変える酵素を手助けする働きがあります。疲労回復の効果があるほか、脳のエネルギー源に欠かせないブドウ糖からエネルギーを作り出すことで、神経機能を正常に保っています。白米食が広まり始めた江戸〜明治時代には、ビタミンB1欠乏による脚気が流行し、国民病とされていました。欠かすことのできないビタミンB1は副食でバランスよく摂取する必要があります。白米とうなぎを同時に摂取することで、より吸収を高める効果が期待できます。

ビタミンB1：疲労回復・脳のエネルギーになる

ビタミンB2
糖質、脂質、タンパク質をエネルギーに変える働きがあります。

ビタミンB2：

ビタミンD
カルシウムの吸収や代謝を助けます。カルシウムは体への吸収率が低いのですが、ビタミンDと一緒に
また、油と一緒に摂ることで吸収率が高まります。

ビタミンD：

ビタミンE
細胞の抗酸化作用
血管の拡張を促し、血の巡りを良くします。酸素を体のすみずみまで行き渡らせることで、新陳代謝を高め、肌のターンオーバー

ビタミンE：抗酸化作用・ニキビに効く

カルシウム
骨や歯を丈夫にするほか、神経興奮を抑制する作用を持ち、ストレスを鎮める効果があります。ビタミンDとの相互作用が高いため、両方の栄養素を含むうなぎは

カルシウム： 

亜鉛
タンパク質を含む食品に豊富に含まれる亜鉛は、新しい細胞を作り出すのに必要不可欠なミネラルです。肌や爪、髪の細胞の新陳代謝を促進させ健康状態を保つ働きがあります。また、大きな特徴として正常な味覚を保つ働きもあります。物を食べるとき、舌の表面にある味蕾で味を感じ取ります。味蕾の細胞の入れ替わりを促し味覚を正常に保つことで、毎日の食事を美味しく感じさせているのは他でもない亜鉛の役目なのです。

亜鉛：肌、爪、髪などの健康維持・味覚を正常に保つ

タンパク質
筋肉を作ります。

タンパク質：血や肉を作る

DHA・EPA
EPAは、血液をサラサラにし、血管系の病気を防ぐ効果があります。コレステロールの

DHA・EPA：血管系病気の予防・成人病の予防