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
SwiftUI で Neumorphism!!!
Search
Ryo Tsuzukihashi
April 27, 2020
Programming
2
1.9k
SwiftUI で Neumorphism!!!
SwiftUIでのNeumorphsim の実装方法
ライブラリとアプリの紹介
Ryo Tsuzukihashi
April 27, 2020
Tweet
Share
More Decks by Ryo Tsuzukihashi
See All by Ryo Tsuzukihashi
レビューを増やしつつ 高評価維持するテクニック
tsuzuki817
3
1.1k
二次元コードを読み取りやすくするために 画面を強制的に明るくするのは もうやめにしませんか?👀
tsuzuki817
0
420
動画だけじゃない!iOS 15のピクチャ・イン・ピクチャを使って好きなUIを表示させよう!
tsuzuki817
3
4.7k
iOS 16からのロック画面Widget争奪戦に備える
tsuzuki817
2
1k
Complications and widgets: Reloadedの要約
tsuzuki817
1
1.2k
Speech framework tips
tsuzuki817
1
2.6k
Build complication in SwiftUI の要約
tsuzuki817
0
700
SwiftUIで作りながら学ぶアニメーション インジケーター編
tsuzuki817
0
590
Other Decks in Programming
See All in Programming
生成AI時代のフルスタック開発
kenn
3
390
生成AIで知るお願いの仕方の難しさ
ohmori_yusuke
1
120
ドメイン駆動設計とXPで支える子どもの未来 / Domain-Driven Design and XP Supporting Children's Future
nrslib
0
170
VibeCoding時代のエンジニアリング
daisuketakeda
0
160
Flutterでllama.cppをつかってローカルLLMを試してみた
sakuraidayo
0
140
eBPF超入門「o11yに使える」とは (20250424_eBPF_o11y)
thousanda
1
120
By the way Google Cloud Next 2025に行ってみてどうだった
ymd65536
0
130
ComposeでWebアプリを作る技術
tbsten
0
130
Designing Your Organization's Test Pyramid ( #scrumniigata )
teyamagu
PRO
5
1.3k
知識0からカンファレンスやってみたらこうなった!
syossan27
4
130
エンジニアが挑む、限界までの越境
nealle
1
330
Cloudflare Workersで進めるリモートMCP活用
syumai
1
250
Featured
See All Featured
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
41
2.3k
Navigating Team Friction
lara
185
15k
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
Documentation Writing (for coders)
carmenintech
71
4.8k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
52
2.5k
Six Lessons from altMBA
skipperchong
28
3.8k
The World Runs on Bad Software
bkeepers
PRO
68
11k
Designing for Performance
lara
608
69k
A better future with KSS
kneath
239
17k
Designing Experiences People Love
moore
142
24k
Typedesign – Prime Four
hannesfritz
41
2.6k
Building a Modern Day E-commerce SEO Strategy
aleyda
40
7.2k
Transcript
3ZP5TV[VLJIBTIJ 4XJGU6*Ͱ/FVNPSQIJTN <0/-*/&>QPUBUPUJQT
w ࣗݾհ w /FVNPSQIJTNͱʁ w 4XJGU6*Ͱͷ࣮ݱํ๏ w ϥΠϒϥϦ࡞Γ·ͨ͠ w /FVNPSQIJTNσβΠϯΛదԠͨ͠ΞϓϦϦϦʔε
ΞδΣϯμ
!UTV[VLJ w :BIPP+"1"/৽ଔ w 1BZ1BZϑϦϚJ04։ൃ w झຯ ݸਓΞϓϦ։ൃ ແਓౡ։ ࣗݾհ
Nuemorphism!!!
/FVNPSQIJTNͱʁ w ৽͍͠ ʮεΩϡʔϞϑΟζϜʯ w ໌Δ͍ӨΛࠨ্ʹɺ҉͍ӨΛӈԼʹ͢Δ w ͳΜ͔৽ͯ͘͠ྑ͍☺ Neumorphism in
user interfacesΑΓ ˠͦͦεΩϡʔϞϑΟζϜͱʁ
εΩϡʔϞϑΟζϜͱʁ w ݱ࣮ͷ࣭ʹࣅͤͯɺ Ϣʔβʹͳ͡Έ͘͢͠ɺ ײతʹૢ࡞Λཧղͤ͞Δ͜ͱ͕Ͱ͖Δ J04 ౾UJQT ΪϦγΞޠͷʮTLFPVTʯ ೖΕ
ͱʮNPSQIÊʯ ܗ ͱݴ͏୯ޠ͔Β࡞ΒΕͨΒ͍͠ɻ
4XJGU6*ͰͲ͏࣮͢Δͷ͔ʁ w $PMPSͷ&YUFOTJPOͰϕʔεͷΧϥʔίʔυΛड͚औΔ $PMPS IFYl$%&#z w ϕʔεͷًͷΈΛม͑ͨͷͰ ӨΛ࡞Δ w
4XJGU)4#ͷΈରԠ w IFY3(#")4-")4# /FVNPSQIJTN 4PGU6* JO6TFSJOUFSGBDFEFTJHO5VUPSJBMΑΓ /FVNPSQIJTNྩ࣌ͷεΩϡʔϞʔϑΟζϜ @touyoubuntu
Ͳ͕ͬͪ/FVNPSQIJTN ౾UJQT ِ/FVNPSQIJTNʹҙʂ /FVNPSQIJTNനͱࠇͷӨΛ͚ͭΕྑ͍ͱݴ͏ Θ͚Ͱແ͍ͷͰ͢ɻ
4XJGU6*ͰͲ͏࣮͢Δͷ͔ʁ TIBEPX DPMPSSBEJVTYZ ;4UBDL\ $PMPS IFY$%&# FEHFT*HOPSJOH4BGF"SFB BMM $JSDMF
pMM $PMPS IFY$%&# GSBNF XJEUI IFJHIU TIBEPX DPMPS$PMPS IFY$%&# EBSLFS$PMPS SBEJVT Y Z TIBEPX DPMPS$PMPS IFY$%&# MJHIUFS$PMPS SBEJVT Y Z ^ ͍͢͝؆୯ʂ ͚ͩͲɺͬͱศརʹ͍ͨ͠ʂ
ϥΠϒϥϦ࡞Γ·ͨ͠ let neumorphism = NeumorphismManager( isDark: false, lightColor: Color(hex: “C1D2EB"),
darkColor: Color(hex: "2C292C") ) let contentView = ContentView() .environmentObject(neumorphism) import NeumorphismUI ZStack { neumorphism.color.edgesIgnoringSafeArea(.all) Circle() .fill(neumorphism.color) .frame(width: 200, height: 200) .neumorphismShadow() } 4DFOF%FMFHBUF $POUFOU7JFX ࣮࣭͜ͷߦʹूʂ
ϥΠϒϥϦ࡞Γ·ͨ͠ extension View { func neumorphismShadow() -> some View {
self.modifier(NeumorphismShadowModifier()) } } 7JFX.PEJpFSͷ func body(content: Self.Content) -> Self.Body func body(content: Content) -> some View { content .shadow(color: darkShadowColor, radius: radius, x: x, y: y) .shadow(color: lightShadowColor, radius: radius, x: -x, y: -y) }
ϥΠϒϥϦ࡞Γ·ͨ͠
/FVNPSQIJTNσβΠϯΛదԠͨ͠ΞϓϦϦϦʔε #FGPSF "GUFS #PPL#BOL
GJO ࢀߟ63- https://note.com/hironobukimura/n/n0431c73714e8 https://uxdesign.cc/neumorphism-in-user-interfaces-b47cef3bf3a6 https://qiita.com/touyoubuntu/items/bf887093ec7265efe201 https://qiita.com/MasasaM_shi/items/4b86622bd95fd48deb76 ࡞ͬͨϥΠϒϥϦ(ϓϧϦΫͬͯ·͢ʂʂʂ) https://github.com/tsuzukihashi/NeumorphismUI ϦϦʔεͨ͠ΞϓϦ(ΞυόΠεͬͯ·͢ʂʂʂ) https://apps.apple.com/jp/developer/ryo-tsudukihashi/id1320583602?l