LogoMark.png

増丸竣太/卒業研究I

サルでもパソコンが買えるサイト

QRコードを読み込んで、選択肢を選ぶだけで買うべきパソコンが分かる

見出し.jpg


Overview

Introduction / What is This

パソコンの買い方が分からない人のためにその人に合うスペック(商品)を
提示するサイト

Background and Purpose

元々2020年は、高いシェアを確保していたWindows7のサポートが終了し、パソコン需要の右肩下がりの起点となる年だと予想されていた。
しかし、新型コロナウイルスの影響によりリモートワークが促進され、パソコンの需要は予想を裏切る形で増加した。ノートパソコンに関しては、約894万台と過去最高の国内出荷台数を記録したほどだ。

多様なパーツで構成されるパソコンの性質上、どうしても「難しいもの」「よく分からない」というイメージを持っている人は一定数存在する。例として、Youtubeで「パソコン 買い方」や「パソコン 選び方」で検索した際に表示される動画の再生回数は、多いもので100万回を超えるものもあるほどだ。

「よくわからないものだけど、パソコンは必要だから買う」という心持ちでお店に行くと、結果的にオーバースペックの高価なものを購入してしまう可能性は大いにある。
そんな人のために、ちょうどいい商品を提案し、少しでも費用を節約するものがあればいいのではないかと思い、今回これを制作するに至った。

Concept

分からない人のために、シンプルに道を示す

Output

siryou01.jpg

≪現在のワイヤーフレーム≫


Tools

adobe Photoshop
adobe Illustrator
adobe Premiere pro
adobe After effect
VS code

Term

2021.04~

Conclusion / Summary

途中で題材を変更した影響もあり、前期での進捗は微々たるものになったが、XDでの試作は形にはなった。今後は、学生に対しての直接質問したりとさらなる調査や、HTML、CSSによるコーディングを行っていく。



Survey

Present Status


Precedent

問は4つと少なくサイトデザインもシンプル、選択肢についても丁寧な説明だが、結果が自分が何を重視しているかとうものであり、直接的に提案してくれるものではない。

こちらもシンプルなデザインではあるものの、選択肢が多く、選択すること自体に面倒だと感じる可能性がある。

上記2つの事例は「パソコン 選び方 診断」と検索した際に上にヒットする2つになる。
診断結果が自分の傾向やメーカーなど、「結局どんなの買えばいいの?」という疑問を解決するものではないと感じた。
そのため、スペックや商品を提示するものは、分からない人にとっての道を定める意味でも需要があるのではないかと考える。


Technique / Technology

HTML
CSS




Project Management

Schedule

後期分制作中

ToDo

後期に向けて



worklog




2021.07.27

プレゼン用ページ ← Click!




2021.07.16

試作

サイトの大まかな機能をXDにて構成 ← Click!

HTMLなどで実際に組み上げていく際に変更する部分がある可能性が高いため、現時点で想定しているデザインになる。
コーディングに関しては、夏休み中に取り組む予定。その際に、今回のデザインとのすり合わせを行う。




2021.07.09

試作

コンセプトに沿ったシンプルなUIを制作した。
最初のメニュー(学部選択画面)を九産大のホームぺージに寄せ、それ以降は学部それぞれの色をメインカラーとして進んでいく。
画像は芸術学部のもの。学部の色はホームページの学部紹介にて使用されている色を参考にしている。

見出し2.jpg




2021.07.02

試作

ターゲットを一般向けから学生向けに絞ることにした。詳細に言えば、九州産業大学に通う学生に向けたものにする。
理由としては、対象が曖昧な一般よりも、まずはある程度知れている学生に向けたものを制作した方がやりやすいのではないかと考えたからだ。
それに伴い、サイトのデザインも九州産業大学のホームページに寄せたものにする予定である。




2021.06.25

試作

「複雑なものを取り扱うからシンプルに」というコンセプトを立てた。
それをもとに試作を開始。現時点では、3つの質問に対して適当なものを選択し、それを3回繰り返すという仕様となっている。

旧モック02.jpg
旧モック01.jpg




2021.06.18

題材決定

「サルでもパソコンが買えるサイト」を制作することにした。
具体的には、パソコンに対して、複雑でよくわからないという人に向けて、選択肢を選ぶだけで適当なスペック(商品)を表示するというもの。
ワイヤーフレームをXDで制作し、コーディングをHTML、CSSで行う。それぞれ前期、後期で行う予定。




2021.06.11

題材変更

現在の題材に意味を見出せなくなってしまったため、題材変更をすることとした。
題材は現在考え中。
案として、パソコンの買い方が分からない人向けの何かを制作というものがある。




2021.06.04

試作

S08.jpg
S07.jpg

タイポグラフィ案について試作。
明朝体の漢字らしさとの両立を考えたが、どれも控えめすぎて区別がつかないため、試行錯誤中。この案については明朝体にこだわる必要はない方向でも考える。




2021.05.28

調査

漢字をタイポグラフィにする案を考える。
川であれば川の要素を取り入れた文字を使用することでより分かりやすくなるのではないかと考えた。




2021.05.21

試作

S4.jpg
S5.jpg
S3.jpg

イメージを試作し、説明用のイメージとしても制作した。
いざ形にすると少し圧が強く感じたため、フォントや並べ方を別パターンを検討する。




2021.05.14

試作

説明用のイメージ画像を制作
言葉で説明するのが難しい題材であるため、急務として行う。

S4.jpg




2021.05.07

調査

漢字が分かりやすいフォントを見つける。明朝体を使用するとやはり漢字らしさのようなものがでるため、この方向性で試作を進める。




2021.04.23

調査

パズルにはどういったものがあるのかを調査してみた。

https://item.rakuten.co.jp/slowworks/08169-150119-02/
アルファベットとそれに関連する(イニシャルなど)動物を組み合わせた立体パズル、木製のおもちゃ。子供向けではあるが、アルファベットと動物などを一緒に覚えられる可能性があるため良い相乗効果が生まれていると考える。

https://tabi-labo.com/296750/wt-herdingcatspuzzle
猫のパズルで、ピースも猫型というもの。それぞれ個別の要素を持ちながら、組み合わせると一つのものに成るという意味で、現在自分が考えているものに一番近いものになる。




2021.04.16

試作

3.png

写真を使用したパズルを制作し、そのベースとなるフレームに文字情報を入れ込む。

2.png

パズルは基本的に完成図がパッケージや説明書なりに載っているが、今回考えているものは完成図を載せず、フレームに書いてある文字情報を頼りに完成を目指すというものを想定している。




2021.04.09

考案

写真を使用したパズルを制作する予定。
完成図が存在せず、パズルのベース部分に書かれた漢字をもとに組み上げていくようなもの。




PAGES

GUIDE

添付ファイル: file見出し2.jpg 78件 [詳細] file旧モック02.jpg 85件 [詳細] file旧モック01.jpg 84件 [詳細] file見出し.jpg 94件 [詳細] filesiryou01.jpg 184件 [詳細] filemidasi2.jpg 131件 [詳細] filemidasi.jpg 59件 [詳細] fileS08.jpg 250件 [詳細] fileS07.jpg 251件 [詳細] fileS5.jpg 313件 [詳細] fileS4.jpg 307件 [詳細] fileS3.jpg 312件 [詳細] file3.png 396件 [詳細] file2.png 398件 [詳細] file1.png 54件 [詳細]
Last-modified: 2021-07-28 (水) 00:36:03