田代爽乃/情報デザイン研究II

芸術学部専用サイト 九芸パレット

芸術学部生に寄り添ったサイトの考案・制作

• 田代爽乃
• Keywords：information, website, communication
• 九芸パレットのプロトタイプ
  
  

概要

これは何？

芸術学生に寄り添ったサイト

背景と目的

背景

• K’sLifeが使いにくい
• 大学が情報伝達ツールとしてK’sLifeに依存している
• 他学科が何をしているかわからない
• 芸学の情報が拾いづらい
• 情報の発信源がまとまっていない
  
  

目的
芸術学部の情報がまとまっており、学生同士で情報が共有できる場所をつくる

コンセプト

• 情報が拾いやすく、整理されていて利用しやすいサイト
• スッキリと見せるために<シンプル>でありながら、単調にならず、だれもが親しみやすくなるよう<ポップ>な雰囲気のサイトを目指す
• 丸みを帯びた形や明るい色を活用して、だれもが親しみやすくなるようポップな雰囲気に
  
  

成果物の仕様

webサイト

• サイトマップ
  
  
  
• スマホ版ワイヤーフレーム
  
  
• PC版ワイヤーフレーム
  
  
• プロトタイプ
  
  

メンバー

• 江川珠貴　サイトマップ、メインビジュアル、プロトタイプ
• 田代爽乃　PC版ワイヤーフレーム、プロトタイプ
• 西山実伶　情報管理、プロトタイプ
• 濱有希子　ワイヤーフレーム、プロトタイプアニメーション
• 渡辺侑貴　UI、プロトタイプ
  
  

制作ツール

• ハードウエア
  • MacbookAir
  • iPad
• ソフトウエア
  • ibisPaint
  • PowerPoint
  • Adobe Illustrator 2023
  • Adobe XD
  • figma
    
    

プロジェクトの期間

2023.09.20 - 2023.12.20

まとめ

サイトという形式ではないが、目標である動くプロトタイプを完成させることができた。
最近では、スマホで手軽に情報を得る人が多いことから、スマホ規格で制作を進めることが主流になりつつあることを知った。そのため、私たちもワイヤーフレームやプロトタイプはスマホ規格で作成し、スマホでの利用を意識した制作を進めている。今後の制作でも利用する人のことを考え、このサイトのニーズである学生間の交流がやり易い環境開発を目指す。
また、本制作はwordpressで行うため子テーマの作成やPHPの理解など、勉強も同時に行っていこうと思います。

調査

現状調査

• K's lifeが使いづらい
• Teamsの利用率が低い
• 芸学の情報が埋もれてしまう
  
  

先行事例

• ソーシャルデザイン学科
• 九州産業大学 芸術学部
• 株式会社ABI新卒採用サイト
• 公立大学法人 長岡造形大学
• マカロニえんぴつ Official Website
  
  

技法・技術情報

• Figma使い方
• Figmaアニメーション
  
  
  
  

プロジェクト管理

スケジュール

Googleスプレッドシート

ToDo

• ターゲット層の決定
• スケジュール決定
• サーバー決定
• 開発エンジンの決定
• 目的の明確化
• コンセプト決定
• サイトデザイン
• プロトタイプ作成

2023.12.20

あしらいの先行事例2

個人作業
Pinterest

プロジェクトミーティング

プロジェクトノート

2023.12.13

あしらいの先行事例

個人作業
Pinterest

プロジェクトミーティング

プロジェクトノート

2023.12.06

最終発表メモ

九芸パレットについて

• 元々ある情報を活用する(公式サイトにリンクするなど)
• 次の世代の事も考えて、引き継ぎしやすいように仕様書などの制作を行う
  
  

発表について

• 発表の際には各自の役割についても説明した方が良い
  
  

プロジェクトミーティング

プロジェクトノート

2023.11.29

PC版ワイヤーフレームの修正

個人作業
Googleドライブ

Figmaでの共同作業

担当：学内情報
プロトタイプ

プロジェクトミーティング

プロジェクトノート

2023.11.22

PC版ワイヤーフレームの修正

個人制作
Web版ワイヤーフレーム

プロジェクトミーティング

プロジェクトノート

2023.11.15

プロトタイプに使用するWordPressテーマの調査

個人調査

• Lightning
• Cocoon
• XeoryExtension
• Fukasawa
• OnePress
  
  

プロジェクトミーティング

プロジェクトノート

2023.11.08

スマホ版ワイヤーフレーム案の制作

個人作業
AdobeXD

プロジェクトミーティング

プロジェクトノート

2023.11.01

プロジェクトミーティング

プロジェクトノート

2023.10.25

ワイヤーフレームの制作

個人作業

• ワイヤーフレーム1
• ワイヤーフレーム2
• ワイヤーフレーム3
  
  

プロジェクトミーティング

プロジェクトメモサイト

2023.10.18

ワイヤーフレームの制作(仮)

個人作業

• ワイヤーフレーム(仮)
  
  

プロジェクトミーティング

プロジェクトノート

2023.10.11

先行事例

個人調査

• ソーシャルデザイン学科
• 九州産業大学 芸術学部
• 九芸WORKS
• 公立大学法人 長岡造形大学
• 映画「窓辺にて」公式サイト
• tumugi助産院
• マカロニえんぴつ Official Website
• 森と踊る
  
  

プロジェクトミーティング

プロジェクトノート

2023.10.04

プロジェクトミーティング

プロジェクトノート

2023.09.27

プロジェクトミーティング

プロジェクトノート

2023.09.20

メモ

• PukiWiki、HTML・CSS、Word Pressなど、どのような環境で制作していくか
• サイトの基本の構成を考える
• 芸術学部生全体へのアンケートの制作
• アンケートから、足した方がいい項目を考える
• サイトマップの制作
• ワイヤーフレームの制作
• サイトの制作
• 役割を分担し、それぞれで活動する
  
  

プロジェクトミーティング

プロジェクトノート