#author("2024-12-15T14:31:50+09:00;2024-12-13T14:40:49+09:00","default:member","member") #author("2024-12-15T14:39:05+09:00;2024-12-13T14:40:49+09:00","default:member","member") *生命科学部公式サイト &small(2025 リニューアル); https://lifescience.kyusan-u.ac.jp #image(main.png) -''角田 雄一'' -'''Keywords：WebDesign, CMS, PukiWIki, VI''' //-https://www.example.com -__[[プレゼン資料>https://drive.google.com/drive/folders/1UqZLrZozLZ5YBL3K81YMp-5hpAeU4HGs?usp=sharing]]__ //-__[[相互評価シート>https://www.example.com]]__ ← ここからコメントをお願いします。 ~ //***CONTENTS //#contents2_1 //~ **概要 ***プロジェクト概要 生命科学部の情報発信を行うサイトのリニューアル ~ ***背景・目的 現在のサイトについて、生命科学部の先生方の要望や、会議を通して明らかになった改善点として以下のものがあった。 -来年からの学科増設に伴い、新しい学科のページが必要。 -サイトのターゲットが、在校生なのか、一般の方なのか、受験生なのか、不明瞭。 -更新する教員が少なく、空白・書きかけの項目や、更新されていない項目が多い。 -本来は同一項目内に掲載するべきページが複数に分散していたり、ホーム画面に情報が集中してしまったり、情報が整理されていない。 それらを踏まえ、主に「受験生向けの情報発信に特化させる」ことと、「発信する情報を絞り、整理し、ユーザーが見やすく、メンテナンスしやすいサイト構成にする」ことを主な方針とし、サイトをリニューアルすることにした。 ~ ***成果物 -テスト環境：XXXXX.XXXXX.XXXX.XX -移行先（現行サイト）：https://lifescience.kyusan-u.ac.jp ~ ***メンバー -[[興梠媛愛/情報デザイン研究II]] -[[角田雄一/情報デザイン研究II]] -担当：[[井上貢一]] ~ ***プロジェクトサイト -[[Project/生命科学部公式サイトリニューアル]] ~ ***担当 - [[井上貢一]] - 米満宗明 教授（生命科学部） - 金子たかね 准教授（生命科学部） ~ ***仕様 （準備中） CMSには PukiWiki を使用 -[[サイトマップ>https://www.figma.com/board/KTs5vQTmbYLseqjrSGle6S/%E7%94%9F%E5%91%BD%E7%A7%91%E5%AD%A6%E9%83%A8%E3%82%B5%E3%82%A4%E3%83%88%E3%83%9E%E3%83%83%E3%83%97?node-id=0-1&t=GCkUPn1bfmfuZNLa-1]] -[[ワイヤーフレーム>https://www.figma.com/design/CukLb2pVgPjdkDwoQ4nzs4/%E7%94%9F%E5%91%BD%E7%A7%91%E5%AD%A6%E9%83%A8%E3%83%AF%E3%82%A4%E3%83%A4%E3%83%BC%E3%83%95%E3%83%AC%E3%83%BC%E3%83%A0?node-id=0-1&t=C1IQGEOOXQw9v4qT-1]] -[[作品概要>https://drive.google.com/file/d/1QOkXqJb4TgPH9yipagSIfAkxL5lcbrqN/view?usp=sharing]] ~ ***制作ツール //&color(red){使用するツール｜ハードウエア・ソフトウエア}; Figma XAMPP PukiWiki Visual Studio Code //--Doom Emacs (orgファイル) //-依存関係 ~ ***プロジェクトの期間 //&color(red){プロジェクトの期間｜20XX.XX.XX - 20XX.XX.XX }; 2024.09.16 - 2025.XX.XX ~ ***まとめ //&color(red){プロジェクトが完結したら「まとめ」を記載して下さい。}; 今回の制作は、受験生向けのサイトにすることと、サイト情報を整理し、使いやすく、メンテナンスしやすいサイトにすることが主な目的であった。 プロジェクト開始当初は、「とりあえず指摘されたところを変更しよう」という態度であった為、サイトの問題点と変更点を整理することができず、制作計画も立てにくかったが、プロジェクトの主な目的・方向性を明確に定めることで、目的に沿った改善案もこちらから提案することもでき、会議がさらに有意義なものとなり、制作計画も立てやすくなった。このことから、制作依頼を受けた際の目的・方向性の明確化の重要性を実感した。 そして、今回はCMS にPukiWiki を用いたが、PukiWiki を利用することで「ナビゲーションの追加・削除」や「コンテンツの移動」等の作業がかなりスムーズに行えることが分かった。情報発信を目的とし、かつページや記事の更新が頻繁に行われるサイトでPukiWiki を採用することの有効性を改めて確認した。 ~ ~ **調査 ***現状調査 //&color(red){プロジェクトのテーマに関わる社会の現状と問題の洗い出し}; -[[現行サイト>https://lifescience.kyusan-u.ac.jp/main/]] -[[前回のプロジェクトページ>Project/生命科学部公式サイト]] ~ ***先行事例 //&color(red){プロジェクトのテーマに該当する先行事例の紹介、傾向分析など}; -九州産業大学ソーシャルデザイン学科のwebサイト -[[九州産業大学理工学部のwebサイト>https://riko.kyusan-u.ac.jp]] ~ ***技法・技術情報 //&color(red){プロジェクトの遂行に必要な技法・技術に関する調査}; -WEB Designing 2022/04 VOL.213 マイナビ出版 2022 特集 コンテンツマーケティングが大きく変わる！CMS新時代2022 -[[PukiWiki>https://pukiwiki.sourceforge.io]] -https://design.kyusan-u.ac.jp/OpenSquareJP/?LocalServer -https://design.kyusan-u.ac.jp/OpenSquareJP/?CMS -https://design.kyusan-u.ac.jp/OpenSquareJP/?PukiWiki -https://design.kyusan-u.ac.jp/OpenSquareJP/?PukiWiki/Customize --https://design.kyusan-u.ac.jp/SampleSite/pukiwiki_minimal/ -https://design.kyusan-u.ac.jp/OpenSquareJP/?FilePermission -[[PukiWiki サイトの開発イメージ（Made with Draw.io）>https://www.draw.io/?lightbox=1&highlight=0000ff&edit=_blank&layers=1&nav=1&title=PukiWikiDevWorks.html#Uhttps%3A%2F%2Fdrive.google.com%2Fuc%3Fid%3D1dnUXhc5gvDH3AXvqGSVXbq-0HjxIZjZb%26export%3Ddownload]] ~ ~ **プロジェクト管理 ***スケジュール //&color(red){計画的な遂行のために、進行管理表を作成してリンクして下さい。}; ~ ***ToDo //&color(red){やるべきこと（タスク）を箇条書きにします。}; //&color(red){完了後は「%%取り消し線%%」あるいは「// コメントアウト」」}; -ワイヤーフレーム作成 -作品概要作成 -コーディング --スマホ画面のヘッダーの変更 --パソコン画面のトップ・ボトム移動ボタン --スマホ画面のトップ・ボトム移動ボタン -コンテンツの移動 //***NotToDo //&color(red){やらないこと：何をするかではなく「何をしないか」を考える}; ~ ~ #hr CENTER:''進捗記録'' //&color(red){最新の情報を一番上に記載して下さい（古い記事が下へ沈む）。}; #hr ~ ~ **2024.12.2 ***進捗 -スマホ画面のヘッダーレイアウトの変更 ~ ***最終発表役割分担 -研究の背景・目的（角田） -生命科学部の現状・技術情報（角田） -サイトマップ（興梠） -ワイヤーフレーム（興梠） -コンテンツ（興梠） -コーディング（角田） -まとめ（角田） ~ ~ **2024.11.25 ***打ち合わせ -魚のアイコンで応用生物学コースの追加 -現行サイトのページの更新をかける -色等は変えない方針で -サイトマップに関しての変更はFigmaにて更新済み ~ ***概要集チェック項目 -ファイルのデータは5MB程 - 「～だ、～である調」で書く ~ ~ **2024.11.18 ***進捗 - 打ち合わせ内容の確認 -サンプルを用いたPukiwikiのプログラミング ~ ~ **2024.11.11 ***進捗 -サンプルを用いたPukiwikiのプログラミング ~ ~ **2024.10.28 ***進捗 -サンプルを用いたPukiwikiのプログラミング ~ ~ **2024.10.21 ***サイトマップ -[[Figma>https://www.figma.com/board/KTs5vQTmbYLseqjrSGle6S/%E7%94%9F%E5%91%BD%E7%A7%91%E5%AD%A6%E9%83%A8%E3%82%B5%E3%82%A4%E3%83%88%E3%83%9E%E3%83%83%E3%83%97?node-id=0-1&t=GCkUPn1bfmfuZNLa-1]] ←こちらからご覧いただけます -コースが４つになる -コース別お知らせページ --食品科学コースのみ掲載、しかもだいぶ前の更新 --コース別お知らせは必要か、必要ならどのページにするか、会議で検討。 -受験生向け情報ページ --今までトップページや、サイドメニューの「受験生の方へ」リンクに分散していた、受験生向け動画、お知らせなどの情報をヘッダーのナビゲーション一つにまとめる。 --資格と進路、カリキュラムについては現在ページがないため、今回のリニューアルで情報を追加 --それぞれ受験生用ページに追加するのか、個別コースごとに追加するのか次回の話し合いで相談 --受験生のためのお問い合わせフォームも欲しいとのことだったため、ここにページを作る。 --九産大ホームページへのリンクは受験生用ページにあったほうがいいと思うが、現在のようにヘッダーに置くのか、受験生向け情報ページに置くのか、会議で要検討。 -学科案内資料 --2022年から更新されていない --残すのかどうか、会議で要検討 -ご案内サブメニュー --ご案内メニューの中の、受験生向け情報とお問い合わせフォームはヘッダーにまとめるため、ここには不要。 --事務室への連絡先や、スタッフの情報はどちらかというと在学生向け情報なので、在学生の方へというメニューにし、事務室やその他在学生向けリンクをまとめて置く場所にした。 -Aboutページ --もともとご案内ページにあったAboutページの置く場所がなくなるのだが、そもそも書きかけなので、Aboutページを残すのかどうか、残すならどこに置くか会議で要検討。 ~ ***PukiWiki準備進捗 -ローカルサーバーのインストール、PukiWikiのローカル環境での動作確認、初期設定ファイルで初期設定方法を確認 -サンプルを使って、ページのフレーム構造とスタイルの基本的な書き換え方を確認 ~ ~ **2024.10.14 ***topページと受験生用ページの扱いの違いをどうするか 例えば... -topページには学生や教授等の活動のみを記載する -受験生用ページをナビゲーションに追加し、現在topページに記載してある入試関連の情報がを移動する ~ ***ロゴ横のタイトルは生命科学部で固定 -現在は設定でページごとのsubmenuページに飛ぶが、top画面に飛んだ方が使用しやすいと考える ~ ***資格と進路、カリキュラムについて -現在ページがないため、今回のリニューアルで情報を追加 -それぞれ受験生用ページに追加するのか、個別コースごとに追加するのか次回の話し合いで相談 ~ ***在学生向けページについて -現在何も情報が入っていないため、事務室情報など在学生が必要な情報ページを一まとめにして詰め込む形で、1ページのみにするのはどうか ~ ***Aboutページ -要検討 -一度分類から分けている ~ ***コースごとのお知らせページ -個別に必要か？ -2021から追加更新がないまたは記事自体ない -topページを学生や教授等の活動のみを記載するため、ここに記載していけば良いのではないだろうか ~ ***ポスターセッション担当 -概要説明 興梠 -会議の内容と現状調査 興梠 -サイトマップの説明、次回の話し合いで聞くこと 角田 -pukiwikiの進捗 角田 ~ ~ ***現在のサイトマップ [[Figma>https://www.figma.com/board/KTs5vQTmbYLseqjrSGle6S/%E7%94%9F%E5%91%BD%E7%A7%91%E5%AD%A6%E9%83%A8%E3%82%B5%E3%82%A4%E3%83%88%E3%83%9E%E3%83%83%E3%83%97?node-id=0-1&t=GCkUPn1bfmfuZNLa-1]] ~ ~ **2024.10.07 ***生命科学部現状 -学科の色：#DA5D9E -ホーム画面の生命科学部の文字を押すと、編集ガイドのリンクページに飛ぶため、普通にホーム画面に飛んだほうが良いかも。 -事務室のダミーページは削除したほうが良いかも。 ~ ***現在のサイトマップ [[Figma>https://www.figma.com/board/KTs5vQTmbYLseqjrSGle6S/%E7%94%9F%E5%91%BD%E7%A7%91%E5%AD%A6%E9%83%A8%E3%82%B5%E3%82%A4%E3%83%88%E3%83%9E%E3%83%83%E3%83%97?node-id=0-1&t=GCkUPn1bfmfuZNLa-1]] ~ ~ **2024.09.30 ***生命科学部現状 - 学科が四つになる - 研究室ページは、教授名じゃなくて研究室一覧を表示する - トップページの写真を変えたい - インスタ等、各種SNSリンク要らない - 動画専用のページや最近のトピックのページを作り、ヘッダー等のナビゲーションを置くなどしたい - 化粧品、加工食品といった特徴を前面に押し出す - お問い合わせフォームや事務室のメールアドレスから連絡取れるようにできたらいいな - カリキュラムと取得可能な資格を閲覧できるページを作る ~ ***所感 - トップページにあるパンフレット内の動物学、水産学、植物学などの解説は、すごく魅力的なので、それぞれ一ページ使うくらい詳しくやったほうが良い - トップページのナビゲーションのカルーセルの画像は、すでにとてもいい画像だと思った。画像の和気あいあいとした雰囲気を残しつつ、上記専門分野に関連した画像を載せるといい - 学科トップページはリンクだけだと寂しいので、最近の様子のトピックをリンク下に載せるのもあり - ~ ~ **2024.09.23 ***テーマ案決定 本の貸し借りWebアプリの一部機能を実装したプロトタイプをつくる -実装する機能 --アカウント認証（メールアドレス・パスワード） --プロフィール編集 --自分の本の管理（本の登録・編集・感想の記入） -成果物 --ソースコード --UI確認サイト(フロントエンドのみの操作感確認サイト) --テスト映像 --データ構造の図 ~ ~ **2024.09.16 ***テーマ案絞り出し -前期「情報デザイン研究I」で制作したWebサイトのUIの改善 -体重、食事内容、摂取カロリーなどを記録しておける健康管理ツールをスプレッドシートで制作 -本の貸し借りWebアプリの制作を最終目標として、その一部機能を実装したプロトタイプの制作 ~ ***先行事例の調査 -健康管理ツールについて --アプリ: __[[あすけん>https://www.asken.jp/]]__ カロリーだけでなく、PFCバランスもグラフで表示される。 体重の増減グラフを備えている。 --食事管理スプレッドシート: __[[shoya_chiritsumo_powerbuilder>https://note.com/shoya_chiritsumo/n/ned9ec5eabecc]]__ 今回の案と類似した体重管理のスプレッドシート。 少しレイアウトが見づらいのと、食事内容・カロリー・栄養素を入力する手間が掛かる。 -本の貸し借りアプリ --小さな図書館向けの本の貸し借りシステム: __[[BooSS>https://www.booss.work/manual?locale=ja]]__ グループの作成と利用者の登録が可能。利用者のみ借りることができる。 人と人とをマッチングして貸し借りするものではない。 --スマホで使える貸出管理アプリ: __[[カシカシ>https://casican.blogspot.com/]]__ コミュニティ内で使う、様々なアイテムの貸し借り管理ができる。 書籍の管理機能が充実しており、書籍のバーコードからISBN情報を読み取り、書籍情報を自動で取得するというリッチな機能を備えている。 --図書管理ツール: __[[リブライズ>https://librize.com/ja]]__ 主に蔵書管理を目的としたツール。本の貸し借りも管理できる。 蔵書管理の機能も付けてもいいなと思った。本の分類法が課題となるだろう。 ~ ~ ~