Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
3時間でつくるいいかんじのポートフォリオサイト
Search
Tajima Sachiko
January 22, 2020
Design
1
360
3時間でつくるいいかんじのポートフォリオサイト
#Zli_DeNA_LT
眠い中3時間で作ったのでとても適当です。
https://schktjm.github.io/
よければみてください。
Tajima Sachiko
January 22, 2020
Tweet
Share
More Decks by Tajima Sachiko
See All by Tajima Sachiko
ゼロから始めるアクセシビリティ啓蒙活動
schktjm
1
2.3k
CLUB p1ass を作った
schktjm
0
210
はじめての npm パッケージ作り
schktjm
0
260
E2E テスト入門
schktjm
0
440
Firebaseでお手軽OGP生成
schktjm
0
550
vuexとvue-routerとあれこれ
schktjm
0
1.3k
秋の大LT2019 in Aizu
schktjm
0
100
Treasure体験記
schktjm
1
460
Other Decks in Design
See All in Design
RIDLEY JONES - Ridley's Christmas Carol
serenascipio
1
150
富山デザイン勉強会_インフォグラフィックが上手に描けるコツ.pdf
keita_yoshikawa
1
140
Minuto de Aventura
olgastoryboard
0
130
Tuzukuru解説ブック
atsumaru1377
0
300
新しいemoji😄のアイデアをUnicodeが募集中‼️🏃♀️💨💨💨傾向を学んでみんな提案しよう💪
oguemon
2
580
User Experience Design für Entwickler
joergneumann
4
950
PdMを始めたUIデザイナーのリアルな課題
muture
0
720
What Was UX Design All About?
ykazu
3
680
Карта процесса-опыта. Презентация метода
ashapiro
0
180
Pizza Trail v2
jerfusart
0
110
We Baby Bears-Triple T Tiger
yvonnehsuanho
PRO
0
430
デザインスプリントを活かすチームの在り方
mixi_design
PRO
1
680
Featured
See All Featured
YesSQL, Process and Tooling at Scale
rocio
167
14k
Learning to Love Humans: Emotional Interface Design
aarron
270
40k
Making Projects Easy
brettharned
113
5.8k
Designing on Purpose - Digital PM Summit 2013
jponch
114
6.8k
Designing for humans not robots
tammielis
248
25k
It's Worth the Effort
3n
182
27k
Faster Mobile Websites
deanohume
304
30k
Facilitating Awesome Meetings
lara
49
5.9k
jQuery: Nuts, Bolts and Bling
dougneiner
61
7.4k
Code Review Best Practice
trishagee
62
16k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
190
16k
Building Adaptive Systems
keathley
36
2.1k
Transcript
3時間でつくる いいかんじ(?)の ポートフォリオサイト @schktjm 2020/1/20 Zli x DeNA合同LT会
自己紹介 name : 田嶋幸智子 (schktjm) lab : DB研 like :
フロントエンド・デザイン(自己流 hobby : バイク・日本酒・新しいもの
ごめんなさい
よしポートフォリオサイトつくろう! ←会津に向かう 高速バスでので きごと
1. 書くことをきめる こんなかんじかなー
2. デザインを決める やりたいこと: ネオン風のデザイン
2. デザインを決める やりたいこと: ネオン風のデザイン
None
3. テキトーにデザイン作ってみる 活躍するのは、最近流行りのこいつ!
3. テキトーにデザイン作ってみる drop-shadowの値とテキトーにぐりぐりし てみる 右の例では - fontSizeをBoldに - 黒いdrop-shadowを右下に -
白いdrop-shadowを左上に
3. テキトーにデザイン作ってみる できた
4. 実装していく(HTML) 正直HTMLにCSS当てれば良さそう
4. 実装していく(HTML) できた
5. 実装していく (CSS) - とても小規模なので設計を気にしなくても大 丈夫そう - がんがんいくよ
5. 実装していく(CSS) text-shadow プロパティにinsetができないらしい? この内側に凹んでる表現ができない →
とりあえずできた! https://schktjm.github.io/ (worksに一切リンクを入れてないです><) (Linksがアイコンじゃないのはガイドライン読むのめんど かった><)
感想 - cardはよかったが文字だとなんか浮いて見える - 読みづらい ( 文字が - text-shadowがそんな使えない -
読みづらい ( リンクかボタンかわからん - 解像度の高い画像が悪目立ちしそう - 読みづらい ( 画面を暗くするとわからない - (でも読ますための文字は凸凹させないほうがよさそうです)
まとめ - 個人的には好きだけどアクセシビリ ティ的に見づらいったらありゃしない ので来なさそう - 流石に手をかけてなさすぎなのでも うちょい改善します ♀
みてね https://schktjm.github.io/