SlideShare a Scribd company logo
1 of 35
これまでのポートフォリオ履
歴全部。
サイボウズ UXデザイナー / フリーランスデザイナー
樋田勇也
2018/2/26 ポートフォリオナイト
樋田 勇也
デザイナー
制作会社でWebデザイナー/コーダー/ディレクターを経験後、
2016年にサイボウズ入社。現在はクラウドサービスkintoneのUX / UI デザイナー。
複業でフリーランスのデザイナーもやってます。
@toi_toi_y yuya.toida.9
今日話したいこと
 かっこいいポートフォリオは世の中にたくさんあるけど、
そこに至る過程は見たことがない
 なので今日は自分が初めてポートフォリオを作った時から
現在に至るまでを共有してみようと思います。
ポートフォリオ Ver β
学生時代
 当時はエディトリアルデザイ
ナーになりたかった
 紙媒体のデザイナーになれる
と思って入社したらWebデザ
イナーやってた。
ポートフォリオ Ver 1.0
入社1年目
初のポートフォリオサイト
 学生時代の作品をアーカイブ
したかった。
 WordPressを学びたかった。
当時の悩み
 こんな低クオリティなもの作って出して大丈夫かな?
 作品をドヤ顔で紹介するとか、恥ずかしい〜
当時の悩み
 こんな低クオリティなもの作って出して大丈夫かな?
 作品をドヤ顔で紹介するとか、恥ずかしい〜
誰も見てないからさっさと作れ!👹
作ってよかったです。
 作品について説明する訓練ができた
 コーディングスキルのレベルアップ💪
ポートフォリオ Ver 2.0
社会人3年目
 会社での実績が溜まってきて
載せたくなってくる。
立ちはだかる壁
会社でやった案件は「会社の実績」
なので、個人の実績としては公開
しないでください。
立ちはだかる壁
ぐぬぬ… 😩
会社でやった案件は「会社の実績」
なので、個人の実績としては公開
しないでください。
非公開ポートフォリオに
 実績を一般に公開できるかどうかは要確認
 できなくてもなんらか道はあるし、アーカイブしておいた
ほうが良いです。
ポートフォリオ Ver 3.0
社会人6年目
 転職したくてたまらなくなる。
 転職用に色々アップデート。
ポートフォリオ作っててよかった〜
 0から作るのは相当大変だった(と思う)
 アーカイブしていたおかげでCloseしたサイトもちゃんと
データが残ってる。
アップデートしたこと
 ポートフォリオ自体でスキルをアピール
 作品を見やすいUI
 自作でコーディングスキルをPR
転職成功
どうでしたか?
 作品が順番に無駄な画面遷移なく見える
 UIを設計するスキルがあるんだな〜
 サイトも自分で作ってるんですね!
 コーディングのスキルがあるんだな〜
採用担当の声
どうでしたか?
 作品が順番に無駄な画面遷移なく見える
 UIを設計するスキルがあるんだなぁ〜
 サイトも自分で作ってるんですね!
 コーディングのスキルがあるんだなぁ〜
作戦通り💪
採用担当の声
ポートフォリオ Ver 4.0
複業対応
 転職後、複業でデザインをやる
ことに。
 複業にも対応できるポートフォ
リオにしたい。
うちの会社に合う人か?
スキルはあるのか?
今までどういう仕事を?
何ができるの?
この人に仕事お願いし
ても大丈夫?
採用担当
顧客
長期
短期
2重管理はめんどくさい
 ログイン / 非ログインで情報を分ける
ログイン前 ログイン後
そしてアップデートは続く…
 イベントやLTなどで露出の機会が増えたので、そういう情
報も出していきたい。
 セルフブランディング? どうしたらいいですか?
まずは作ろう
 いきなり良いポートフォリオを作らなくても良いと思う
 世間には素晴らしいポートフォリオがいっぱいあって焦る
けど、少しづつ近づいて行きましょう。
https://toi-toi-toi.com/
※裏ページにログインしたい人は個人的に聞いてください
今日紹介したポートフォリオ

More Related Content

What's hot

誰のためのUI? - モノづくりのゴールを実現するフレームワーク -
誰のためのUI?  - モノづくりのゴールを実現するフレームワーク -誰のためのUI?  - モノづくりのゴールを実現するフレームワーク -
誰のためのUI? - モノづくりのゴールを実現するフレームワーク -Mikihiro Fujii
 
重要なのはリサーチ・プランニング・プロトタイプの三本柱
重要なのはリサーチ・プランニング・プロトタイプの三本柱重要なのはリサーチ・プランニング・プロトタイプの三本柱
重要なのはリサーチ・プランニング・プロトタイプの三本柱Yuya Toida
 
Fukui Biz Cafe Side.I #1 「デザイナーのひきだし」
Fukui Biz Cafe Side.I  #1 「デザイナーのひきだし」Fukui Biz Cafe Side.I  #1 「デザイナーのひきだし」
Fukui Biz Cafe Side.I #1 「デザイナーのひきだし」Miho Yamamori
 
デザイナーからみた仕事をしやすいディレクター
デザイナーからみた仕事をしやすいディレクターデザイナーからみた仕事をしやすいディレクター
デザイナーからみた仕事をしやすいディレクターtake-it
 
groundwork-pasona-tech
groundwork-pasona-techgroundwork-pasona-tech
groundwork-pasona-techmasaaki komori
 
福井で「しあわせデザイナー」になるために
福井で「しあわせデザイナー」になるために福井で「しあわせデザイナー」になるために
福井で「しあわせデザイナー」になるためにMiho Yamamori
 
Sketchで変わるワークフロー
Sketchで変わるワークフローSketchで変わるワークフロー
Sketchで変わるワークフローAsami Yamamoto
 
デキるWebデザイナーを目指せ!本当に現場で使えるCC活用テクニック
デキるWebデザイナーを目指せ!本当に現場で使えるCC活用テクニックデキるWebデザイナーを目指せ!本当に現場で使えるCC活用テクニック
デキるWebデザイナーを目指せ!本当に現場で使えるCC活用テクニックAkiko Kurono
 
デザインのためのデザイン
デザインのためのデザインデザインのためのデザイン
デザインのためのデザインMasayuki Uetani
 
コーディングを考慮したWebデザインガイドライン
コーディングを考慮したWebデザインガイドラインコーディングを考慮したWebデザインガイドライン
コーディングを考慮したWebデザインガイドラインHiroyuki Makishita
 
【第二回】デザイン初心者でも出来る!企業ロゴの作り方【案出し~デザイン作成編】
【第二回】デザイン初心者でも出来る!企業ロゴの作り方【案出し~デザイン作成編】【第二回】デザイン初心者でも出来る!企業ロゴの作り方【案出し~デザイン作成編】
【第二回】デザイン初心者でも出来る!企業ロゴの作り方【案出し~デザイン作成編】schoowebcampus
 
エクスペリエンス・デザイン
エクスペリエンス・デザインエクスペリエンス・デザイン
エクスペリエンス・デザインSaori Baba
 
モバイルにも通用するデザインカンプ制作のイロハ
モバイルにも通用するデザインカンプ制作のイロハモバイルにも通用するデザインカンプ制作のイロハ
モバイルにも通用するデザインカンプ制作のイロハHiroyuki Makishita
 
レスポンシブサイト制作に効く デザインTipsあれこれ
レスポンシブサイト制作に効く デザインTipsあれこれレスポンシブサイト制作に効く デザインTipsあれこれ
レスポンシブサイト制作に効く デザインTipsあれこれAkiko Kurono
 
Uxデザイナーがpoとして開発チームと”握る”ためにやっていること 170927
Uxデザイナーがpoとして開発チームと”握る”ためにやっていること 170927Uxデザイナーがpoとして開発チームと”握る”ためにやっていること 170927
Uxデザイナーがpoとして開発チームと”握る”ためにやっていること 170927英明 伊藤
 
デザイナーとエンジニアの良い関係
デザイナーとエンジニアの良い関係デザイナーとエンジニアの良い関係
デザイナーとエンジニアの良い関係Kanako Kawahara
 
Webアクセシビリティが無視されすぎで気にくわない。
Webアクセシビリティが無視されすぎで気にくわない。Webアクセシビリティが無視されすぎで気にくわない。
Webアクセシビリティが無視されすぎで気にくわない。uenoyuuki
 
これからのWebデザイナーのキャリアプラン
これからのWebデザイナーのキャリアプランこれからのWebデザイナーのキャリアプラン
これからのWebデザイナーのキャリアプランSasaki Kouhei
 
グラフィックレコーディングをやってみよう!ワークショップ資料 150301
グラフィックレコーディングをやってみよう!ワークショップ資料 150301グラフィックレコーディングをやってみよう!ワークショップ資料 150301
グラフィックレコーディングをやってみよう!ワークショップ資料 150301Azumi Wada
 
0からのウェブディレクション講座:制作・開発編 ver 3.00
0からのウェブディレクション講座:制作・開発編 ver 3.000からのウェブディレクション講座:制作・開発編 ver 3.00
0からのウェブディレクション講座:制作・開発編 ver 3.00Yusuke Kojima
 

What's hot (20)

誰のためのUI? - モノづくりのゴールを実現するフレームワーク -
誰のためのUI?  - モノづくりのゴールを実現するフレームワーク -誰のためのUI?  - モノづくりのゴールを実現するフレームワーク -
誰のためのUI? - モノづくりのゴールを実現するフレームワーク -
 
重要なのはリサーチ・プランニング・プロトタイプの三本柱
重要なのはリサーチ・プランニング・プロトタイプの三本柱重要なのはリサーチ・プランニング・プロトタイプの三本柱
重要なのはリサーチ・プランニング・プロトタイプの三本柱
 
Fukui Biz Cafe Side.I #1 「デザイナーのひきだし」
Fukui Biz Cafe Side.I  #1 「デザイナーのひきだし」Fukui Biz Cafe Side.I  #1 「デザイナーのひきだし」
Fukui Biz Cafe Side.I #1 「デザイナーのひきだし」
 
デザイナーからみた仕事をしやすいディレクター
デザイナーからみた仕事をしやすいディレクターデザイナーからみた仕事をしやすいディレクター
デザイナーからみた仕事をしやすいディレクター
 
groundwork-pasona-tech
groundwork-pasona-techgroundwork-pasona-tech
groundwork-pasona-tech
 
福井で「しあわせデザイナー」になるために
福井で「しあわせデザイナー」になるために福井で「しあわせデザイナー」になるために
福井で「しあわせデザイナー」になるために
 
Sketchで変わるワークフロー
Sketchで変わるワークフローSketchで変わるワークフロー
Sketchで変わるワークフロー
 
デキるWebデザイナーを目指せ!本当に現場で使えるCC活用テクニック
デキるWebデザイナーを目指せ!本当に現場で使えるCC活用テクニックデキるWebデザイナーを目指せ!本当に現場で使えるCC活用テクニック
デキるWebデザイナーを目指せ!本当に現場で使えるCC活用テクニック
 
デザインのためのデザイン
デザインのためのデザインデザインのためのデザイン
デザインのためのデザイン
 
コーディングを考慮したWebデザインガイドライン
コーディングを考慮したWebデザインガイドラインコーディングを考慮したWebデザインガイドライン
コーディングを考慮したWebデザインガイドライン
 
【第二回】デザイン初心者でも出来る!企業ロゴの作り方【案出し~デザイン作成編】
【第二回】デザイン初心者でも出来る!企業ロゴの作り方【案出し~デザイン作成編】【第二回】デザイン初心者でも出来る!企業ロゴの作り方【案出し~デザイン作成編】
【第二回】デザイン初心者でも出来る!企業ロゴの作り方【案出し~デザイン作成編】
 
エクスペリエンス・デザイン
エクスペリエンス・デザインエクスペリエンス・デザイン
エクスペリエンス・デザイン
 
モバイルにも通用するデザインカンプ制作のイロハ
モバイルにも通用するデザインカンプ制作のイロハモバイルにも通用するデザインカンプ制作のイロハ
モバイルにも通用するデザインカンプ制作のイロハ
 
レスポンシブサイト制作に効く デザインTipsあれこれ
レスポンシブサイト制作に効く デザインTipsあれこれレスポンシブサイト制作に効く デザインTipsあれこれ
レスポンシブサイト制作に効く デザインTipsあれこれ
 
Uxデザイナーがpoとして開発チームと”握る”ためにやっていること 170927
Uxデザイナーがpoとして開発チームと”握る”ためにやっていること 170927Uxデザイナーがpoとして開発チームと”握る”ためにやっていること 170927
Uxデザイナーがpoとして開発チームと”握る”ためにやっていること 170927
 
デザイナーとエンジニアの良い関係
デザイナーとエンジニアの良い関係デザイナーとエンジニアの良い関係
デザイナーとエンジニアの良い関係
 
Webアクセシビリティが無視されすぎで気にくわない。
Webアクセシビリティが無視されすぎで気にくわない。Webアクセシビリティが無視されすぎで気にくわない。
Webアクセシビリティが無視されすぎで気にくわない。
 
これからのWebデザイナーのキャリアプラン
これからのWebデザイナーのキャリアプランこれからのWebデザイナーのキャリアプラン
これからのWebデザイナーのキャリアプラン
 
グラフィックレコーディングをやってみよう!ワークショップ資料 150301
グラフィックレコーディングをやってみよう!ワークショップ資料 150301グラフィックレコーディングをやってみよう!ワークショップ資料 150301
グラフィックレコーディングをやってみよう!ワークショップ資料 150301
 
0からのウェブディレクション講座:制作・開発編 ver 3.00
0からのウェブディレクション講座:制作・開発編 ver 3.000からのウェブディレクション講座:制作・開発編 ver 3.00
0からのウェブディレクション講座:制作・開発編 ver 3.00
 

Similar to これまでのポートフォリオ履歴全部。 @2018/2/26 ポートフォリオナイト

はじめてのLeanUXから学んだ実体験
はじめてのLeanUXから学んだ実体験はじめてのLeanUXから学んだ実体験
はじめてのLeanUXから学んだ実体験Daichi Aoki
 
Tenkai190406 alexa day2019
Tenkai190406 alexa day2019Tenkai190406 alexa day2019
Tenkai190406 alexa day2019RieMotoki
 
ChatworkのUXリサーチと プロダクトへの生かし方
ChatworkのUXリサーチと プロダクトへの生かし方ChatworkのUXリサーチと プロダクトへの生かし方
ChatworkのUXリサーチと プロダクトへの生かし方Tomoko Nishina
 
Pixateワークショップ―アプリケーションの概要とpixateの使い方 初級編―.pdf
Pixateワークショップ―アプリケーションの概要とpixateの使い方 初級編―.pdf Pixateワークショップ―アプリケーションの概要とpixateの使い方 初級編―.pdf
Pixateワークショップ―アプリケーションの概要とpixateの使い方 初級編―.pdf theguild
 
デザイン屋なりにいろんな人を応援してみた結果
デザイン屋なりにいろんな人を応援してみた結果デザイン屋なりにいろんな人を応援してみた結果
デザイン屋なりにいろんな人を応援してみた結果Kazunori Tateyama
 
200716 cybird breakoutsession_rie_motoki
200716 cybird breakoutsession_rie_motoki200716 cybird breakoutsession_rie_motoki
200716 cybird breakoutsession_rie_motokiRieMotoki
 
191127 vu idesign
191127 vu idesign191127 vu idesign
191127 vu idesignRieMotoki
 
アプリを生み出す現場でUI/UXデザイナーが意識するべきこと:RoomClip
アプリを生み出す現場でUI/UXデザイナーが意識するべきこと:RoomClipアプリを生み出す現場でUI/UXデザイナーが意識するべきこと:RoomClip
アプリを生み出す現場でUI/UXデザイナーが意識するべきこと:RoomCliptakaaya
 
[Presentation]hc dsaloninkyoto2016
[Presentation]hc dsaloninkyoto2016[Presentation]hc dsaloninkyoto2016
[Presentation]hc dsaloninkyoto2016Yuichi Inobori
 
CCC Design Session
CCC Design SessionCCC Design Session
CCC Design SessionMako Mizuno
 
意味をデザインするを考える
意味をデザインするを考える意味をデザインするを考える
意味をデザインするを考えるAya Tokuda
 
禍つヴァールハイトを支えるレイアウト業務
禍つヴァールハイトを支えるレイアウト業務禍つヴァールハイトを支えるレイアウト業務
禍つヴァールハイトを支えるレイアウト業務KLab Inc. / Tech
 
IxD of AWA - インタラクションの考え方
IxD of AWA - インタラクションの考え方IxD of AWA - インタラクションの考え方
IxD of AWA - インタラクションの考え方hidetoshi murohashi
 
Experience Design Out of Screen:これからのエクスペリエンスデザイナーの生きる道@UX TOKYO Jam
Experience Design Out of Screen:これからのエクスペリエンスデザイナーの生きる道@UX TOKYO JamExperience Design Out of Screen:これからのエクスペリエンスデザイナーの生きる道@UX TOKYO Jam
Experience Design Out of Screen:これからのエクスペリエンスデザイナーの生きる道@UX TOKYO JamAkihiko Kodama
 
191004 voice worldz_motoki
191004 voice worldz_motoki191004 voice worldz_motoki
191004 voice worldz_motokiRieMotoki
 
PMと並走してプロダクトにつなげるUXリサーチ
PMと並走してプロダクトにつなげるUXリサーチPMと並走してプロダクトにつなげるUXリサーチ
PMと並走してプロダクトにつなげるUXリサーチJunNomura1
 
About Design Manager
About Design ManagerAbout Design Manager
About Design ManagerMarino Yokoi
 
200521_rpa_community_for_girls_riemotoki_presentation_sheet
200521_rpa_community_for_girls_riemotoki_presentation_sheet200521_rpa_community_for_girls_riemotoki_presentation_sheet
200521_rpa_community_for_girls_riemotoki_presentation_sheetRieMotoki
 
Portfolio ver01
Portfolio ver01Portfolio ver01
Portfolio ver01Ryuichi07
 
もしも素人営業ウーマンが UI/UXデザイナーになったら
もしも素人営業ウーマンが UI/UXデザイナーになったらもしも素人営業ウーマンが UI/UXデザイナーになったら
もしも素人営業ウーマンが UI/UXデザイナーになったらChloe Takahashi
 

Similar to これまでのポートフォリオ履歴全部。 @2018/2/26 ポートフォリオナイト (20)

はじめてのLeanUXから学んだ実体験
はじめてのLeanUXから学んだ実体験はじめてのLeanUXから学んだ実体験
はじめてのLeanUXから学んだ実体験
 
Tenkai190406 alexa day2019
Tenkai190406 alexa day2019Tenkai190406 alexa day2019
Tenkai190406 alexa day2019
 
ChatworkのUXリサーチと プロダクトへの生かし方
ChatworkのUXリサーチと プロダクトへの生かし方ChatworkのUXリサーチと プロダクトへの生かし方
ChatworkのUXリサーチと プロダクトへの生かし方
 
Pixateワークショップ―アプリケーションの概要とpixateの使い方 初級編―.pdf
Pixateワークショップ―アプリケーションの概要とpixateの使い方 初級編―.pdf Pixateワークショップ―アプリケーションの概要とpixateの使い方 初級編―.pdf
Pixateワークショップ―アプリケーションの概要とpixateの使い方 初級編―.pdf
 
デザイン屋なりにいろんな人を応援してみた結果
デザイン屋なりにいろんな人を応援してみた結果デザイン屋なりにいろんな人を応援してみた結果
デザイン屋なりにいろんな人を応援してみた結果
 
200716 cybird breakoutsession_rie_motoki
200716 cybird breakoutsession_rie_motoki200716 cybird breakoutsession_rie_motoki
200716 cybird breakoutsession_rie_motoki
 
191127 vu idesign
191127 vu idesign191127 vu idesign
191127 vu idesign
 
アプリを生み出す現場でUI/UXデザイナーが意識するべきこと:RoomClip
アプリを生み出す現場でUI/UXデザイナーが意識するべきこと:RoomClipアプリを生み出す現場でUI/UXデザイナーが意識するべきこと:RoomClip
アプリを生み出す現場でUI/UXデザイナーが意識するべきこと:RoomClip
 
[Presentation]hc dsaloninkyoto2016
[Presentation]hc dsaloninkyoto2016[Presentation]hc dsaloninkyoto2016
[Presentation]hc dsaloninkyoto2016
 
CCC Design Session
CCC Design SessionCCC Design Session
CCC Design Session
 
意味をデザインするを考える
意味をデザインするを考える意味をデザインするを考える
意味をデザインするを考える
 
禍つヴァールハイトを支えるレイアウト業務
禍つヴァールハイトを支えるレイアウト業務禍つヴァールハイトを支えるレイアウト業務
禍つヴァールハイトを支えるレイアウト業務
 
IxD of AWA - インタラクションの考え方
IxD of AWA - インタラクションの考え方IxD of AWA - インタラクションの考え方
IxD of AWA - インタラクションの考え方
 
Experience Design Out of Screen:これからのエクスペリエンスデザイナーの生きる道@UX TOKYO Jam
Experience Design Out of Screen:これからのエクスペリエンスデザイナーの生きる道@UX TOKYO JamExperience Design Out of Screen:これからのエクスペリエンスデザイナーの生きる道@UX TOKYO Jam
Experience Design Out of Screen:これからのエクスペリエンスデザイナーの生きる道@UX TOKYO Jam
 
191004 voice worldz_motoki
191004 voice worldz_motoki191004 voice worldz_motoki
191004 voice worldz_motoki
 
PMと並走してプロダクトにつなげるUXリサーチ
PMと並走してプロダクトにつなげるUXリサーチPMと並走してプロダクトにつなげるUXリサーチ
PMと並走してプロダクトにつなげるUXリサーチ
 
About Design Manager
About Design ManagerAbout Design Manager
About Design Manager
 
200521_rpa_community_for_girls_riemotoki_presentation_sheet
200521_rpa_community_for_girls_riemotoki_presentation_sheet200521_rpa_community_for_girls_riemotoki_presentation_sheet
200521_rpa_community_for_girls_riemotoki_presentation_sheet
 
Portfolio ver01
Portfolio ver01Portfolio ver01
Portfolio ver01
 
もしも素人営業ウーマンが UI/UXデザイナーになったら
もしも素人営業ウーマンが UI/UXデザイナーになったらもしも素人営業ウーマンが UI/UXデザイナーになったら
もしも素人営業ウーマンが UI/UXデザイナーになったら
 

これまでのポートフォリオ履歴全部。 @2018/2/26 ポートフォリオナイト