#author("2024-06-17T14:00:55+09:00","default:member","member") *Welcome to KSU Brass Band! 九州産業大学吹奏楽団部の公式HPを作ろう! #image(main.png) -''原 晴紀'' -'''Keywords:吹奏楽, Webサイト, SNS, 宣伝''' //-https://www.example.com //-__[[相互評価シート>https://docs.google.com/spreadsheets/d/1bwtkZkAxP-fI9Mpo9wlahnFPBTThpZOvhbtDyl21kQM/edit?usp=sharing]]__ ← ここからコメントをお願いします。 ~ ~ -__[[試作>https://preview.studio.site/live/EjOQymA8OJ]]__←こちらに試作があります。 -__[[プロトタイプ評価シート>https://docs.google.com/spreadsheets/d/1bwtkZkAxP-fI9Mpo9wlahnFPBTThpZOvhbtDyl21kQM/edit?usp=sharing]]__ ← ここからコメントをお願いします。 ~ ~ **概要 ***これは何? //&color(red){これは何か・・を簡潔に}; 九州産業大学吹奏楽団部の活動を知ってもらうために 公式のHPを製作するプロジェクト ~ ***背景と目的 //&color(red){プロジェクトの背景と目的}; 現状、InstagramやXなどはあるもののフォロワーがなかなか増えない状況である。そこでKSUブラスについての情報を総合的に閲覧でき、尚且つSNSにもリンクでとべるHPを作った方が良いのではないかという考えに至った。 ~ ***コンセプト //&color(red){基本的な考え方、枠組み、視点など}; -大学生らしさ --明るい --元気 --かっこいい ~ ***成果物の仕様 //&color(red){&small(成果物の形式・サイズ・時間尺等);}; Webサイト ~ ***制作ツール //&color(red){使用するツール|ハードウエア・ソフトウエア}; -STUDIO -illustrator -photoshop ~ ***プロジェクトの期間 //&color(red){プロジェクトの期間|20XX.XX.XX - 20XX.XX.XX }; 2024.04.08 - 2024.XX.XX ~ ~ **プロジェクト管理 ***スケジュール //&color(red){計画的な遂行のために、進行管理表を作成してリンクして下さい。}; ~ ***ToDo //&color(red){やるべきこと(タスク)を箇条書きにします。}; //&color(red){完了後は「%%取り消し線%%」あるいは「// コメントアウト」」}; -%%他団体のサイトを多く閲覧する%% -練習やイベントの写真と動画を集める -%%大まかなレイアウトを考える%% -%%試作を作る%% -試作の改善 -部活の記録や歴史の資料集めをする ~ ~ #hr CENTER:''進捗記録'' //&color(red){最新の情報を一番上に記載して下さい(古い記事が下へ沈む)。}; #hr ~ ~ **2024.06.03 -サイト全体のメインカラーを変更 -レイアウトを調整 --色々なデバイスで確認しながら行う ~ ~ **2024.05.27 ***指摘された問題点 -フォントの統一感を出す -楽器や曲の紹介が欲しい -レイアウトがバラけて見える -大会記録など部の記録を記載する -紹介文の改行が見にくい ~ ***好評価を得た点 -依頼などを送れるお問い合わせがある点 ~ ***その他 -定期更新 -どのパートを募集しているか ~ ~ **2024.04.29 ***今回制作したプロトタイプ #image(サイトマップ.png) サイトマップ #image(ワイヤーフレーム.png) サイトのワイヤーフレーム [[試作>https://preview.studio.site/live/EjOQymA8OJ]] サーバーの動作確認(プロトタイプサイト) ~ ~ **2024.04.22 アイデアの量産 > 絞り込み ~ ***HPの公開方法 -%%検討中%% --%%Google Site%% --[[STUDIO>https://studio.design/ja/]] ~ ***HPの内容(素材ネタ) -練習の様子 -部員紹介 -コンクール、その他コンテストの結果報告 -イベント出演の宣伝、報告(チラシや写真、できれば動画などの掲載) ~ ***HPのネーミング -Welcome to KSU Brass Band! ~ ***HPの構成 -ホーム --お知らせ --KSUブラスについて --お問い合わせ -SNSへのリンク --Instagram --X ~ ***HPの制作環境と方法 -デジタルラボ503のMacもしくは自身のMacBook //--Google Site 主なHPの構成 --illustrator 簡単なイラストやロゴの制作と編集 --photoshop 写真の加工 //-動画編集ツール 決まり次第 ~ ~ **2024.04.15 //***現状分析|演習テーマの確定 //-タイトル:Welcome to KSU Brass Band! //-テーマ採択の背景:現状、InstagramやXなどはあるもののフォロワーがなかなか増えない状況である。そこでKSUブラスについての情報を総合的に閲覧でき、尚且つSNSにもリンクでとべるHPを作った方が良いのではないかという考えに至った。 ~ ***現状調査|テーマ内容の先行事例 -[[コンフォート・ウィンドアンサンブル>https://comfort-wind.jimdofree.com/]] -[[福岡工業大学吹奏楽部吹奏楽団>https://www.fit.ac.jp/~suisou/]] -[[東京佼成ウインドオーケストラ>https://www.tkwo.jp/]] -[[福大ブラス[福岡大学応援指導部吹奏楽団]>http://fukudai-brass.com/]] ~ ***現状調査|表現形式の先行事例 -[[PerfectDiary Japan>https://jp.perfectdiary.com/]] -[[ME:I OFFICIAL SITE>https://me-i.jp/]] ~ ***現状調査|時間軸(対象の歴史的知見) -[[吹奏楽の歴史>https://ja.wikipedia.org/wiki/%E5%90%B9%E5%A5%8F%E6%A5%BD%E3%81%AE%E6%AD%B4%E5%8F%B2]] 吹奏楽とは、「管楽器と打楽器のみの合奏、すなわち弦のないオーケストラである」と規定される。 ~ ***現状調査|空間軸(対象の地理的知見) - [[日本の吹奏楽発祥の地・妙香寺パイオニア吹奏楽団>https://jpn.pioneer/ja/corp/sustainability/social/contribution/music/pwe/column/column_36.php#:~:text=%E5%BD%93%E5%9B%A3%E3%81%8C%E6%BC%94%E5%A5%8F%E3%81%99%E3%82%8B,%E3%81%93%E3%81%A8%E3%81%AF%E5%88%86%E3%81%8B%E3%82%8A%E3%81%BE%E3%81%9B%E3%82%93%E3%80%82]] 一般的にはルーツは古代エジプトにあり、ヨーロッパにおいてオスマン・トルコ時代のトルコ軍楽隊で発展した、などといわれていますが、いずれにせよ明確に「何年に誕生した」ということは分かりません。 ~ ***現状調査|技術 -制作ツール(illustrator,photoshopなど) -[[ホームページを自分で作成する方法14選!無料で試せるツールを紹介>https://www.xserver.ne.jp/bizhp/how-to-create-a-homepage/]] -[[HTML の基本 - ウェブ開発を学ぶ - MDN Web Docs>https://developer.mozilla.org/ja/docs/Learn/Getting_started_with_the_web/HTML_basics]] ~ ***解決すべき課題 -Webページの作り方 -見やすさを意識したデザイン -内容 -九州産業大学吹奏楽団部だけにある特徴 ~ ~ **2024.04.08 ***プロジェクトのテーマ候補(10件以上) -九州産業大学吹奏楽団部の公式HP -吹奏楽曲をジャンルごとにまとめて紹介 -自分の楽器(コントラバス)について紹介 -大学周辺のラーメン屋の紹介 -メイクの手順紹介 -使ってよかった化粧品紹介 -一人暮らしお役立ち道具 -好きなアーティストまとめ -推し動画作り方 -長期休みにできること ~ ***参考リンク -[[Webサイトとは? ホームページとの違いや種類を紹介>https://www.sedesign.co.jp/marketing-blog/what-is-website]] -[[【メンズメイク】初心者でもできるやり方&おすすめアイテムをプロが伝授!>https://www.shiseido.co.jp/sw/beautyinfo/DB010075/]] -[[推し動画の作り方は?おすすめの編集ソフト・アプリや制作手順を解説>https://jp.videoproc.com/edit-convert/how-to-make-oshidouga.htm]] ~ ~