Page 1


DESIGNED


BY

K .K A ZUMASA

P O R T- F O L I O 2013-2018


PROFILE/

お手に取っていただきありがとうございます。高専の 情報系の学部から千葉大のデザインに編入という経歴 を持ち、よく考えることを自分の強みにしています。 . ちょっぴり優柔不断だからこそ、はっきりすっきり したデザインを心がける。そんな自分の作品に興味を 持っていただけたら光栄です。


KIYAMA KAZUMASA 木山 順正 千葉大学大学院 / 融合理工学府 / 創生工学専攻 / デザインコース

HISTORY 1994

静岡県三島市 出生

2010 - 2015

沼津高等専門学校制御情報工学科 入学

2015 - 2018

千葉大学工学部デザイン学科 編入

2018 -

千葉大学大学院デザインコース 入学

SKILL DESIGN

TECHNOLOGY

Adobe After Effect

Autodesk Fusion 360

Adobe Photoshop

MAXON Cinema 4D

Adobe Illustrator

Rhinoceros 3D

Adobe Premire

Processing

Adobe Muse

Program

Adobe XD

Java -

Sketch

C-


CONTENTS/

UI/UX_EDITORIAL_BRANDING 本ポートフォリオでは、4 年間デザインを学んできた中で 主に後半の授業やインターンシップで取り掛からせていただいた UIUX デザイン , エディトリアルデザイン、ブランディングデザイン 3分野のデザインについてを抜粋した上でまとめさせていただいています。

Please have a look.


12

PITYHA

18

naviw

28

SWOPON

40

Solor Decathloln

48

千葉大学環境報告書 2017

58

racca racca

72

意匠展


10

// Chap. | 01

// Genre | UIUX

Chap. 01

PYTHA naviw SWOPON

 


// Chap. | 01

// Genre | UIUX

11

UIUX/

視覚的楽しさはもとより“ユーザーの代弁者であること”を念頭に置 いた UI/UX を意識。具体的なユーザーの意見をから、ユーザーの抱 える問題の根本原因を見つけ、それを解決するためのデザインを提案。


パズル × ピタゴラ装置


制作期間:5 日間 制作時期:2018/8 制作人数:1 人


14

// Chap. | 01

// Genre | UIUX


// Chap. | 01

// Genre | UIUX

15


16

// Chap. | 01

// Genre | UIUX


// Chap. | 01

// Genre | UIUX

17


18

// Chap. | 01

// Genre | UIUX


// Chap. | 01

// Genre | UIUX

19

制作期間:1 週間 制作時期:2018/7 制作人数:1 人


20

// Chap. | 01

// Genre | UIUX


// Chap. | 01

// Genre | UIUX

バイク乗りの為の気象情報アプリ 気象条件を受けやすいが故、気象情報に機敏であるライダーたちは多い。 また、移動をし続けることで、一定の場所に留まることのないライダー には各場所のその時の気象条件の把握しなければならないこともある。 そんなライダーたちに向けた気象情報アプリを提案した。

21


22

// Chap. | 01

// Genre | UIUX

Pe r fect for you!!

Co n ce pt その場、その時、あなただけのための気象情報を

Target

Use S ce n e

細かい気候の変化が気になる長距離ライダー

屋外利用・マウントステーでのタッチ操作


// Chap. | 01

// Genre | UIUX

Fe at u re

気象情報アプリ

ロードマップアプリ

Po n i n t

指先1本で操作

大きなボタン

シンプルな UI

23


24

// Chap. | 01

// Genre | UIUX

Test i mo n i al s

ツーリング最中は,

手袋しながらでも

長い時間画面は見られない

使えるように 細かいボタンは あまりない方がいい

機能がたくさんあっても 使わない

特に必要なのは 日射量と風向きと気温

運転ルートと天気が 紐付けされたら便利 運転中は前から あまり目を離せない

先々での気象情報を 乗ってる時は 片手の親指と人差し指

まとめて知れたらな ...

2 本の指しか使えない

ごちやごちゃ しないように 少ない配色で

運転してテンションが上がる おしゃれな UI がいいよね


// Chap. | 01

// Genre | UIUX

Q u e st i o n n ai re

気にしない

とても気になる

ツーリング時 気象情報を 気にする?

そんなに気にしない

気になる

Bot t on

T i me t o re l e ase t h e eye

16.6 M

56dp

36dp

本アプリでの

Goodle の

時速 60 KM で

最小サイズ

推奨サイズ

1秒間に進む距離

25


26

// Chap. | 01

// Genre | UIUX

In t e r face

気象情報表示

マップ表示


// Chap. | 01

出発・目的地表示

// Genre | UIUX

マップ拡大

27


28

// Chap. | 01

// Genre | UIUX


// Chap. | 01

// Genre | UIUX

29

制作期間:1 週間 制作時期:2018/6 制作人数:1 人


30

// Chap. | 01

// Genre | UIUX

お気に入りを " 共有 " して お得にお店を利用しよう。 今日の SNS が普及した世の中では SNS は多くの人の目にとまり、 著名なユーザーともなると宣伝効果は絶大である。 これをユーザーに向けて利益還元することによって ユーザー発信広告が積極的になり充実し、 ショップ側・ユーザー側の双方に利益がでると考えた。


// Chap. | 01

// Genre | UIUX

31


32

// Chap. | 01

// Genre | UIUX

WHAT'S SWOPON SWOPON って何?

SWOPON は SNS を通じて ユーザーがお店を紹介することで, クーポンが得られるグルメアプリ ! 導入先のお店と利用客だけでなく, 紹介したユーザーにもメリットがある 新しいサービスです.

CONCEPT

TARGET

コンセプト

ターゲットユーザー

紹介して嬉しい !! 紹介されて嬉しい !!

10~20 代のおしゃれなモノ好き

共有したくなるグルメアプリ

な SNS 入れ込み系女子

LISTEN 聴き取り

投稿ついでにクーポンを

知り合いのレビューだから

自分のレビューを見てくれた

もらえるなんて2度お得感

なんとなく安心

数が視覚でわかるのはいいかも


// Chap. | 01

// Genre | UIUX

33

FEATURE 特徴

出来高制クーポン

情報の信頼性

高い拡散性

SNSに埋め込まれたリンクからの アクセス数に応じてクーポン発行により 店舗・ユーザー双方にメリット

ビューの書き込みがSNSアカウントとの 連携により行われるので, 情報に親密さから生まれる信頼性

レビューが目にとまる頻度が高いので, 自身のアプリ内よりもより 高い宣伝効果が期待できる

BUSINESS MODEL 事業の流れ

ユーザー間の 繋がりをやりとり

掲載料を払う

クーポンを提供

利用客が増える

見返りのサービスを

お店を SNS を通して

考える

紹介する


34

// Chap. | 01

// Genre | UIUX

HOW TO USE どうやって使う ?

COUPON

サラダ

EW

N

With Green

桜屋

ヘルシー / サラダ

デザート / プリン 渋谷

  800∼

使う

  3.5   34

with GREEN

# カフェ # ランチ # サラダ # 野菜 # ジャー

ヘルシー / ジャーサラダ

¥250

引き

あと 9 クリック !!

800 ∼   4.5   76 東京都渋谷区緑町 123-4 # カフェ # ランチ # スイーツ # ケーキ # チョコレート

Cosme Kitchen

Chocolat Chocolat デザート / ケーキ

ヘルシー / サラダ

渋谷   1200∼

写真

  4.0

使う

  12

10%

# カフェ # ランチ # 無農薬野菜 # ビュッフェ # サラダ

クリスプ ヘルシー / サラダ

OFF

あと 3 クリック !!

with GREEN

評価して共有

ヘルシー / ジャーサラダ 渋谷

  700∼

使う

  3.5   90

¥200

# カフェ # ランチ # 珍野菜 # ジャー # 新鮮

検索する

引き

共有する

受け取る

場所や店名などの情報から

本アプリを通して

リンクのクリック数に応じて

訪れたお店やスポットを検索

SNS でレビューを公開

クーポン発行


// Chap. | 01

// Genre | UIUX

ADVANTAGE 今までとの違い

with GREEN ヘルシー / ジャーサラダ 800 ∼   4.5   76 東京都渋谷区緑町 123-4 # カフェ # ランチ # スイーツ # ケーキ # チョコレート

写真

評価して共有

すぐに共有できる

検索の手間

すぐに見つかる

不明な情報

35


36

// Chap. | 01

// Genre | UIUX

INTERFACE インターフェース

ホーム

検索


// Chap. | 01

情報

// Genre | UIUX

クーポン

37


38

// Chap. | 02

// Genre | EDITORIAL

Chap. 02

ソーラーデカスロン 環境報告書 2018


// Chap. | 02

// Genre | EDITORIAL

39

EDITORIAL/

クライントの意向を汲み取りながらデザインの方向性をすり合わせる という方法をとっている。自分の考えやイメージをわかりやすく相手 に伝えることを念頭に置き、読者にとって読みやすい誌面とは何か? というような客観的な目線を意識したデザインを心がける。


40

// Chap. | 02

// Genre | EDITORIAL

Solor Decathlon Project's 5years Records 2002 年にアメリカで始まった太陽光住宅の国際コ ンペティションである「ソーラー・デカスロン」。次 世代の太陽光住宅を学生が自ら設計、建設し、エネ ルギー効率や革新性など 10 部門の総合得点を競い 合う学生主体のプロジェクトである。それに則り、 記録に関しても千葉大学の学生で行いたいという依 頼を受けて、5年間の記録を 300 ページ弱の冊子と して制作した。

Chiba Univ., Graduete School of Science and Engineering


// Chap. | 02

// Genre | EDITORIAL

41

制作期間:6 ヶ月間 制作時期:2018/8 制作人数:4 人


42

// Chap. | 02

// Genre | EDITORIAL


// Chap. | 02

// Genre | EDITORIAL

43


44

// Chap. | 02

// Genre | EDITORIAL


// Chap. | 02

// Genre | EDITORIAL

45


46

// Chap. | 02

// Genre | EDITORIAL


// Chap. | 02

// Genre | EDITORIAL

47


48

// Chap. | 02

// Genre | EDITORIAL

Ka

Chiba Ma

tsu

do

University Environmental Report C af

é

shi

wa

noh

a


// Chap. | 02

// Genre | EDITORIAL

49 制作期間:5 ヶ月間 制作時期:2017/7 制作人数:5 人

a

han

Ino

iba

Ni

ch shi

En

Ch

vir

iba Un onm iver sit ent y al Re por t

国立大学法人千葉大学

National University Corporation Chiba University


50

// Chap. | 02

Q. A.

// Genre | EDITORIAL

地域の人にも手に取ってもらいやすいようなポップさもありつつ、 報告書という定は維持したカジュアルになりすぎないデザインとは?


// Chap. | 02

// Genre | EDITORIAL

51


52

// Chap. | 02

// Genre | EDITORIAL


// Chap. | 02

// Genre | EDITORIAL

「千葉大学環境報告書 2017」では人と自然が調和した空 想の千葉大学 をテーマに表紙を作成した。 千葉大学 4 キャ ンパスと周辺地域をベースに様々な建物や人を描いたので実際 の千葉大学と比べながら見 ていただければと思う。表紙だけでなく中身のほうも千葉大学周辺の地域の方に見てもらうことを目標に、 親しみを持って読んでもらえるようなデザインを目指した。

53


54

// Chap. | 02

// Genre | EDITORIAL

P OI N T 1 若い人からご老人まで幅広い層の地域の人に読んでもらうことを目標にお いていた為、情報の優劣や読みやすさを意識し、文字の大きさやカラーリ ングを特に気をつけた。また、読むのに抵抗が大きい堅い印象のある文章 よりもできる限り図やグラフでの情報の整理を心がけた。それでおいて、 ポップやカジュアルな雰囲気に寄りすぎない、報告書の枠を外れないくら いの形式的な冊子を意識して制作した。

P OI N T 2 グラフによる「結果」はデータの「核」となるものである。そのため、結 果を示した図表が見にくかったり、カッコ悪かったりすると、「結果」に説 得力がなくなってしまう。結果の示し方は、グラフや表、写真など、分野 や手法によって様々ではある。そこで、各図表において余計な線を省き、 十分なゆとりを取った上で、結果をより正確に伝える縮尺を用いて、見栄 えのよい図表や写真を制作することを意識においた。


// Chap. | 02

POINT 3 「ロジック」や「事柄と事柄の関係性」に即して文字や絵を配置すること、 関係性の強いもの同士は、近くに配置したり、関連のある項目同士を相対 的に近づけることなど「グループ化」を意識したレイアウトを行なっている。 全体の構成やロジックが理解しやすくする為の単調すぎないような配置を 心がけた。関連の強い文章と写真同士を近くに配置し、関連の弱いものは 少し離して配置している。

POINT 4 距離ではなく「色により関連づける」という方「グループ化」も行なっている。 テキストの色と図中の各部位の色を統一させることで、テキストと図の対 応が容易にしている。引出し線なども用いているが、できる限り色によっ て関連付けすることを意識しているまた、章分けにもカラーリングを用い ており、その際の配色は彩度が低めで十分に色相の別れた6色を用いてい る。カラフルでありながら落ち着いた印象のある冊子になっていると思う。

// Genre | EDITORIAL

55


56

// Chap. | 03

// Genre | BRANDING

Chap. 03

racca racca 意匠展


// Chap. | 03

// Genre | BRANDING

57

BRANDING/

" モノの価値を高めるには " という模索を続けながら、作りたいもの、 売りたいものを持ち寄ることで成り立つことを価値として意識してい る。持って見てというような嬉しい価値を創出している。


58

// Chap. | 03

// Genre | BRANDING


// Chap. | 03

// Genre | BRANDING

59

制作期間:3 年間 制作時期:2018/10 制作人数:6 人


60

// Chap. | 03

千葉大学デザイン学科7人の グループでの活動のひとつで り,グループの起点でもある ジュエリー,雑貨ブランド "racca racca".千葉大学祭か ら始まり,デザインフェスタ やデザインギャラリーへの出 展をし,Webでの販売も展開 中である.今後も活動を広げ ていく予定である.

// Genre | BRANDING


// Chap. | 03

// Genre | BRANDING

61


62

// Chap. | 03

// Genre | BRANDING


// Chap. | 03

// Genre | BRANDING

CONCEPT

繊細ナチュラル

BRAND IMAGE

千葉県の特産品である落花生の軽やかな響きから名付け た.アクセサリーと雑貨のブランドアイデンティティー をより強めることに取り組んでいる.各メンバーが作り たいもの,売りたいものを持ち寄ることで成り立つこと をブランドのイメージとし,個人の個性を打ち出した作 品を売り出している.

63


64

// Chap. | 03

// Genre | BRANDING

PRIMARY LOGO

SUB LOGOS


// Chap. | 03

// Genre | BRANDING

COROR PALETTE

FONTS

Hello

こんにちは

ABCDEFGHIJKLMNOPQRSTUVWXYZ

あいうえおかきくけこさしすせそたちつてと

ABCDEFGHIJKLMNOPQRSTUVWXYZ

ナニヌネノハヒフヘホマミムメモヤユヨ

65


// Genre | BRANDING

No.2

// Chap. | 03

No.1

66

PENDULUM Reuleaux Heptagon Super Elliptical

KATACHI maru sankaku sikaku drop


// Chap. | 03

// Genre | BRANDING

toki ajisai kaede

CORE PRODUCT

ityo kotoba konnichiha sayonara gomenne

No.4

No.3

arigato

67


68

// Chap. | 03

// Genre | BRANDING

WEB

ネット媒体を使い,SNSを通して活動の報告を行ったり, 通販サイトを使った販売も行っている.また自身のWEB サイトも制作・公開し,制作物の紹介や認知度向上のた めの広告作業も行なっている.


// Chap. | 03

// Genre | BRANDING

69


70

// Chap. | 03

// Genre | BRANDING

GALARY


// Chap. | 03

大学祭の出店から始まり,現在はギャラリーや展示会, デザインフェスなどにも活動の幅を広げている.今後は 実店舗に限らず,本格的にネットなども含めた場で広い 視野で活躍できたらと考えている.

// Genre | BRANDING

71


72

// Chap. | 03

// Genre | BRANDING

きて、みて、とって

毎日の中で、自分の感情や何か物事に出会う きっかけである " とって " をテーマに デザイン学科の生徒が生んだデザインから いろんな感情や経験を掴み取ってきたものを披露する展示会として " 意匠展 " を作り上げた.


// Chap. | 03

// Genre | BRANDING

73

制作期間:7 ヶ月 制作時期:2018/2 制作人数:15 人


website < smartphone, tablet, laptop, desktop

ページから扉ページ、そのほかのページの作成を行った。またそれに当たって個人の写真撮影を行った。

へと繋げた . また、ここで決まった柔らかな雰囲気であるメインビジュアルを冊子に落とし込み、個人

テーマである " とって " から VI の制作を行った。この提案をポスターやダイレクトメールのデザイン

Paper

74


// Chap. | 03

// Genre | BRANDING

75


76

// Chap. | 03

// Genre | BRANDING


77

Media メインビジュアルを WEB サイト用に展開し、制作を行った。PC、スマホの対応はもちろん、様々なデ バイスに対応させるためのレスポンシブなデザインを製作した。本サイトに訪れた方に展示会に興味を 持って来てもらうように本サイトだけでは展示会のテーマの全ては分かりきらない情報量を心がけた。 website < smartphone, tablet, laptop, desktop


78

Exibition デザイン学科の生徒が4年間で生んだデザインからいろんな感情や経験を掴み取ってきたものを披露す る展示会となった。五反田の東京デザインセンターで開催したこの展示会には、多くの人の来場があり、 目的のひとつであったお客さんにとって自発的な出会いの場所を提供することが達成できた。 Exhibition stand, Presentation board


// Chap. | 03

// Genre | BRANDING

79


TO CLOSE/ appreciative words. 最後までお目通しいただきありがとうございます。 本ポートフォリオでは、UIUX, エディトリアル、ブランディングの3点をまとめさせ ていただきましが、プロダクトや CG のデザインにも経験があります。 ここに掲載したものに止まらず、様々なことをこなせる幅の広いデザイナーを目指し ています。こんな自分に興味を持っていただけたら光栄です。 またお会いできる機会を楽しみにしております。


T H ANK

YOU.


Profile for Kazumasa.K

Portfolio_KazumasaK_v3.2  

Portfolio_KazumasaK_v3.2  

Profile for 271973
Advertisement