TDU FEN LT #2 http://fen.connpass.com/event/6577/

1. パクって上達する
Webデザイン
keisei (@keisei_1092)
TDU Future Engineering Night LT #2 2014.6.28

2. PROFILE (近況)
• keisei (Lv.20)
• iOS Developer Programの話を
したかった・・・・・・。
• 大学クソ忙しい
• 最近は講習資料制作(ソフ研)
で作曲もやってない
• 最近のマイブームは弥生軒の
唐揚げそば（写真）
• ねとらぼに掲載されてた
2

3. 今回話すこと
• 内容
• 自分のやりたいWebデザインを
（パクることで）作る
• 対象
• Webデザインに興味がある全ての人
• 値段
• ¥0
3 Today’s font: Gill Sans Light

4. 初心者だと
何から始めれば良いか分からない
4

5. ってことで・・・
5

6. パクろう！
6

7. ググる
7

8. 良さげなのを見つける
8

9. 良さげなのを見つける
9

10. 参考にする場所を選ぶ
10

11. 推敲
• クリックすると横に画面が遷移して情報が出てくる
• メニューがカーブしている
• 無理っぽいので早急に諦め
• 縦に実装するとメニューで占有して
情報量が少なくなりそう
• 今回は横に並べることに
11

12. とりあえずこんな感じに
12

13. ここらへんまで来ると自分で
やりたいことがきっと出てくる
13

14. 自分の場合
14
• 各メニューを透明にしてメニュー通りの色を
背景に設定→左右にアニメーション

15. ググる、そして
妥協できるところに落とし込む
15

16. ね、簡単でしょ
16

17. ソフ研の公式サイト
17

18. ソフ研の公式サイト
18

19. 追従するメニュー
19

20. パク参考にしたページ
20

21. ソフ研サウンド班のサイト
21

22. ソフ研サウンド班のサイト
22

23. ソフ研サウンド班のサイト
23

24. 参考にしたページ
24

25. 参考にしたページ
25

26. 大事なこと
• なぜそのデザインがイケてるのか考える
• 配色
• 配置
• スペース
• イケてるサイトA、スタイリッシュなB、流行を取り
入れたC・・・・・・
• いつかオリジナルといえるデザインを目指したい
26

27. くれぐれも趣味以外の場では
パクらないようにしましょう
27

28. 参考にしたサイト
• Coloured Lines
• http://colouredlines.com.au
• 岐阜駅周辺の美容院・美容室ならLATERA(ラテラ)
エンビロンスキンケア
• http://latera.jp/
• 瀬戸内コンピ2 | 特設サイト
• http://momomomiji.com/setouchi2/
28