Download - Prototyping by Adobe Photoshop
Transcript
![Page 1: Prototyping by Adobe Photoshop](https://reader033.vdocuments.us/reader033/viewer/2022060120/559225e31a28abbf4a8b4633/html5/thumbnails/1.jpg)
Adobe® Photoshop®
AdobeおよびPhotoshopは、Adobe Systems Incorporated(アドビシステムズ社)の商標です。
KDDI HackathonJuly 25, 2013Naoki Kanazawa
by
![Page 2: Prototyping by Adobe Photoshop](https://reader033.vdocuments.us/reader033/viewer/2022060120/559225e31a28abbf4a8b4633/html5/thumbnails/2.jpg)
金澤 直毅Naoki Kanazawa
designless.net
![Page 3: Prototyping by Adobe Photoshop](https://reader033.vdocuments.us/reader033/viewer/2022060120/559225e31a28abbf4a8b4633/html5/thumbnails/3.jpg)
1 WORKSPACE
2 TRY&ERROR
3 DESIGN
![Page 4: Prototyping by Adobe Photoshop](https://reader033.vdocuments.us/reader033/viewer/2022060120/559225e31a28abbf4a8b4633/html5/thumbnails/4.jpg)
1
![Page 5: Prototyping by Adobe Photoshop](https://reader033.vdocuments.us/reader033/viewer/2022060120/559225e31a28abbf4a8b4633/html5/thumbnails/5.jpg)
![Page 6: Prototyping by Adobe Photoshop](https://reader033.vdocuments.us/reader033/viewer/2022060120/559225e31a28abbf4a8b4633/html5/thumbnails/6.jpg)
![Page 7: Prototyping by Adobe Photoshop](https://reader033.vdocuments.us/reader033/viewer/2022060120/559225e31a28abbf4a8b4633/html5/thumbnails/7.jpg)
?
![Page 8: Prototyping by Adobe Photoshop](https://reader033.vdocuments.us/reader033/viewer/2022060120/559225e31a28abbf4a8b4633/html5/thumbnails/8.jpg)
!
![Page 9: Prototyping by Adobe Photoshop](https://reader033.vdocuments.us/reader033/viewer/2022060120/559225e31a28abbf4a8b4633/html5/thumbnails/9.jpg)
TOOL
Text
Shape
あA 1
![Page 10: Prototyping by Adobe Photoshop](https://reader033.vdocuments.us/reader033/viewer/2022060120/559225e31a28abbf4a8b4633/html5/thumbnails/10.jpg)
Color, Size, etc...
OPTION
![Page 11: Prototyping by Adobe Photoshop](https://reader033.vdocuments.us/reader033/viewer/2022060120/559225e31a28abbf4a8b4633/html5/thumbnails/11.jpg)
PANELHistory
Information
Setting
![Page 12: Prototyping by Adobe Photoshop](https://reader033.vdocuments.us/reader033/viewer/2022060120/559225e31a28abbf4a8b4633/html5/thumbnails/12.jpg)
LAYERStyle
Adjustment
Opacity & Blend
Mask
![Page 13: Prototyping by Adobe Photoshop](https://reader033.vdocuments.us/reader033/viewer/2022060120/559225e31a28abbf4a8b4633/html5/thumbnails/13.jpg)
2
![Page 14: Prototyping by Adobe Photoshop](https://reader033.vdocuments.us/reader033/viewer/2022060120/559225e31a28abbf4a8b4633/html5/thumbnails/14.jpg)
LAYER STYLESTART
START
![Page 15: Prototyping by Adobe Photoshop](https://reader033.vdocuments.us/reader033/viewer/2022060120/559225e31a28abbf4a8b4633/html5/thumbnails/15.jpg)
![Page 16: Prototyping by Adobe Photoshop](https://reader033.vdocuments.us/reader033/viewer/2022060120/559225e31a28abbf4a8b4633/html5/thumbnails/16.jpg)
SMART FILTER
or
![Page 17: Prototyping by Adobe Photoshop](https://reader033.vdocuments.us/reader033/viewer/2022060120/559225e31a28abbf4a8b4633/html5/thumbnails/17.jpg)
スマートフィルター用に変換
ぼかし > ぼかし(ガウス)
![Page 18: Prototyping by Adobe Photoshop](https://reader033.vdocuments.us/reader033/viewer/2022060120/559225e31a28abbf4a8b4633/html5/thumbnails/18.jpg)
フィルタギャラリー > アーティスティック > カットアウト
![Page 19: Prototyping by Adobe Photoshop](https://reader033.vdocuments.us/reader033/viewer/2022060120/559225e31a28abbf4a8b4633/html5/thumbnails/19.jpg)
レイヤーパネル > ダブルクリック
![Page 20: Prototyping by Adobe Photoshop](https://reader033.vdocuments.us/reader033/viewer/2022060120/559225e31a28abbf4a8b4633/html5/thumbnails/20.jpg)
3
![Page 21: Prototyping by Adobe Photoshop](https://reader033.vdocuments.us/reader033/viewer/2022060120/559225e31a28abbf4a8b4633/html5/thumbnails/21.jpg)
DESIGNUI UX
![Page 22: Prototyping by Adobe Photoshop](https://reader033.vdocuments.us/reader033/viewer/2022060120/559225e31a28abbf4a8b4633/html5/thumbnails/22.jpg)
UI
![Page 23: Prototyping by Adobe Photoshop](https://reader033.vdocuments.us/reader033/viewer/2022060120/559225e31a28abbf4a8b4633/html5/thumbnails/23.jpg)
UX
![Page 24: Prototyping by Adobe Photoshop](https://reader033.vdocuments.us/reader033/viewer/2022060120/559225e31a28abbf4a8b4633/html5/thumbnails/24.jpg)
Appendix
![Page 25: Prototyping by Adobe Photoshop](https://reader033.vdocuments.us/reader033/viewer/2022060120/559225e31a28abbf4a8b4633/html5/thumbnails/25.jpg)
Shortcuts⌘ + J:レイヤーの複製⌘ + T:自由変形⌘ + I: 階調反転⌘ + 1: 100%表示⌘ + delete:背景色で塗りつぶし
![Page 26: Prototyping by Adobe Photoshop](https://reader033.vdocuments.us/reader033/viewer/2022060120/559225e31a28abbf4a8b4633/html5/thumbnails/26.jpg)
Q カーソルが ?A レイヤーをクリック!もしくは、表示してみよう!
FAQ
Q 点線が消えない?A ⌘+Dで選択範囲が消えます!
Q 背景 って?A ダブルクリックで普通のレイヤーになります!