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
370
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
2
2.6k
CLUB p1ass を作った
schktjm
0
210
はじめての npm パッケージ作り
schktjm
0
270
E2E テスト入門
schktjm
0
460
Firebaseでお手軽OGP生成
schktjm
0
580
vuexとvue-routerとあれこれ
schktjm
0
1.4k
秋の大LT2019 in Aizu
schktjm
0
120
Treasure体験記
schktjm
1
480
Other Decks in Design
See All in Design
portfolio2025_kanakoohata
kanako106
0
660
Managing Design Systems (Antwerp 2024)
nathanacurtis
1
380
デザインシステムの力 Webデザイナーとエンジニアのための実践ガイド / The Power of Design System
spindle
9
4.9k
Fem tips om ux-text • WSA-dagen 29 jan 2025
jonas_blind_hen
PRO
0
130
aya_murakami_portfolio
ayakaimi1101
0
1.1k
ネットワークセキュリティ科 学科紹介
sklbj_unz
0
160
20241019-CUD友の会「困った!を解決するデザイン改訂版」交流会
majimasachi
0
320
ネーミングの極意 - その名は体を現していますか? -
kakukoki
2
470
Дизайн современной услуги с Картой процесса-опыта
ashapiro
0
110
2024/11/25 ReDesigner Online Meetup 会社紹介
cybozuinsideout
PRO
0
370
ユーザーに向き合うデザインが介護・福祉の現場を変える / User-facing design changes the field of care and welfare
sms_tech
0
230
私たちは、世界とデザインの〝次の一歩〟を、どこへ向けるか。
tkhr_kws
2
280
Featured
See All Featured
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
29
4.6k
How to Think Like a Performance Engineer
csswizardry
22
1.3k
BBQ
matthewcrist
86
9.5k
Faster Mobile Websites
deanohume
306
31k
Optimising Largest Contentful Paint
csswizardry
34
3.1k
A designer walks into a library…
pauljervisheath
205
24k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
31
2.1k
Why Our Code Smells
bkeepers
PRO
335
57k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
33
2.8k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
251
21k
Side Projects
sachag
452
42k
Java REST API Framework Comparison - PWX 2021
mraible
28
8.4k
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/