サルでもパソコンが買えるサイト
QRコードを読み込んで、選択肢を選ぶだけで買うべきパソコンが分かる
Overview
Introduction / What is This
パソコンの買い方が分からない人のためにその人に合うスペック(商品)を
提示するサイト
Background and Purpose
元々2020年は、高いシェアを確保していたWindows7のサポートが終了し、パソコン需要の右肩下がりの起点となる年だと予想されていた。
しかし、新型コロナウイルスの影響によりリモートワークが促進され、パソコンの需要は予想を裏切る形で増加した。ノートパソコンに関しては、約894万台と過去最高の国内出荷台数を記録したほどだ。
多様なパーツで構成されるパソコンの性質上、どうしても「難しいもの」「よく分からない」というイメージを持っている人は一定数存在する。例として、Youtubeで「パソコン 買い方」や「パソコン 選び方」で検索した際に表示される動画の再生回数は、多いもので100万回を超えるものもあるほどだ。
「よくわからないものだけど、パソコンは必要だから買う」という心持ちでお店に行くと、結果的にオーバースペックの高価なものを購入してしまう可能性は大いにある。
そんな人のために、ちょうどいい商品を提案し、少しでも費用を節約するものがあればいいのではないかと思い、今回これを制作するに至った。
Concept
分からない人のために、シンプルに道を示す
Output
Tools
adobe Photoshop
adobe Illustrator
adobe Premiere pro
adobe After effect
VS code
Term
2021.04~
Conclusion / Summary
途中で題材を変更した影響もあり、前期での進捗は微々たるものになったが、XDでの試作は形にはなった。今後は、学生に対しての直接質問したりとさらなる調査や、HTML、CSSによるコーディングを行っていく。
Survey
Present Status
- 2020年のノートパソコン、“コロナ特需”で出荷台数が過去最高
https://response.jp/article/2021/01/27/342541.html
Precedent
問は4つと少なくサイトデザインもシンプル、選択肢についても丁寧な説明だが、結果が自分が何を重視しているかとうものであり、直接的に提案してくれるものではない。
- 先行事例2
https://pcrecommend.com/
こちらもシンプルなデザインではあるものの、選択肢が多く、選択すること自体に面倒だと感じる可能性がある。
上記2つの事例は「パソコン 選び方 診断」と検索した際に上にヒットする2つになる。
診断結果が自分の傾向やメーカーなど、「結局どんなの買えばいいの?」という疑問を解決するものではないと感じた。
そのため、スペックや商品を提示するものは、分からない人にとっての道を定める意味でも需要があるのではないかと考える。
Technique / Technology
HTML
CSS
Project Management
Schedule
後期分制作中
ToDo
後期に向けて
- コーディングによるデザインの精査
- 学生本人に対する質問など、さらなる調査
2021.07.27
プレゼン用ページ ← Click!
2021.07.16
試作
サイトの大まかな機能をXDにて構成 ← Click!
HTMLなどで実際に組み上げていく際に変更する部分がある可能性が高いため、現時点で想定しているデザインになる。
コーディングに関しては、夏休み中に取り組む予定。その際に、今回のデザインとのすり合わせを行う。
2021.07.09
試作
コンセプトに沿ったシンプルなUIを制作した。
最初のメニュー(学部選択画面)を九産大のホームぺージに寄せ、それ以降は学部それぞれの色をメインカラーとして進んでいく。
画像は芸術学部のもの。学部の色はホームページの学部紹介にて使用されている色を参考にしている。
2021.07.02
試作
ターゲットを一般向けから学生向けに絞ることにした。詳細に言えば、九州産業大学に通う学生に向けたものにする。
理由としては、対象が曖昧な一般よりも、まずはある程度知れている学生に向けたものを制作した方がやりやすいのではないかと考えたからだ。
それに伴い、サイトのデザインも九州産業大学のホームページに寄せたものにする予定である。
2021.06.25
試作
「複雑なものを取り扱うからシンプルに」というコンセプトを立てた。
それをもとに試作を開始。現時点では、3つの質問に対して適当なものを選択し、それを3回繰り返すという仕様となっている。
2021.06.18
題材決定
「サルでもパソコンが買えるサイト」を制作することにした。
具体的には、パソコンに対して、複雑でよくわからないという人に向けて、選択肢を選ぶだけで適当なスペック(商品)を表示するというもの。
ワイヤーフレームをXDで制作し、コーディングをHTML、CSSで行う。それぞれ前期、後期で行う予定。
2021.06.11
題材変更
現在の題材に意味を見出せなくなってしまったため、題材変更をすることとした。
題材は現在考え中。
案として、パソコンの買い方が分からない人向けの何かを制作というものがある。
2021.06.04
試作
タイポグラフィ案について試作。
明朝体の漢字らしさとの両立を考えたが、どれも控えめすぎて区別がつかないため、試行錯誤中。この案については明朝体にこだわる必要はない方向でも考える。
2021.05.28
調査
漢字をタイポグラフィにする案を考える。
川であれば川の要素を取り入れた文字を使用することでより分かりやすくなるのではないかと考えた。
2021.05.21
試作
イメージを試作し、説明用のイメージとしても制作した。
いざ形にすると少し圧が強く感じたため、フォントや並べ方を別パターンを検討する。
2021.05.14
試作
説明用のイメージ画像を制作
言葉で説明するのが難しい題材であるため、急務として行う。
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
試作
写真を使用したパズルを制作し、そのベースとなるフレームに文字情報を入れ込む。
パズルは基本的に完成図がパッケージや説明書なりに載っているが、今回考えているものは完成図を載せず、フレームに書いてある文字情報を頼りに完成を目指すというものを想定している。
2021.04.09
考案
写真を使用したパズルを制作する予定。
完成図が存在せず、パズルのベース部分に書かれた漢字をもとに組み上げていくようなもの。