良いアプリケーションをデザインするための感覚の持ち方 / Cultivating a Sense for Designing Great Applications

｢良いアプリケーションをデザインするための感覚の持ち方｣
ソフトウェアのデザインでは、プラットフォームのシステムとクリエイター独自のコンセプトとが矛盾なく成り立つことに強く意識を向けなければなりません。調和の取れた良いUIを目指すことは、ユーザーにとって親しみやすく、使いやすいソフトウェアへの近道です。この講演では、macOSやiOSにおけるアプリケーションのUIデザインに焦点を当て、クリエイターがアプリケーションを設計する際の自らの独自性の主張方法、プラットフォームへの適合方法、および文化尊重との塩梅を考えます。

--

“Cultivating a Sense for Designing Great Applications”
In software design, it is crucial to focus on seamlessly integrating the platform's system with the creator's unique concept. Aiming for a harmonious and well-designed UI is a shortcut to creating software that is user-friendly and easy to use. This talk will focus on UI design for applications on macOS and iOS, discussing how creators can assert their uniqueness, adapt to the platform, and balance respect for cultural considerations.

--

try! Swift Tokyo 2024
https://tryswift.jp/
https://tryswift.jp/_en
https://tryswifttokyo.hatenablog.com/entry/2024/02/26/104304

Transcript

1. tryswift.jp try! Swift Tokyo 2024 – Session 2024.03.22 ྑ͍ΞϓϦέʔγϣϯΛσβΠϯ͢Δ ͨΊͷײ֮ͷ࣋ͪํ usagimaru Cultivating a Sense for Designing Great Applications © 2024 usagimaru
2. © 2024 usagimaru Software Designer / UI Architect / Developer usagimaru Goodpatch Inc. / Timelab Inc. @usagimaru @usagimaruma bento.me/usagimaru @usagimaru@mastodon.social @usagimaru.bsky.social ؙ
   ྯཬ MARU Satori ! ! layers.to/usagimaru /
3. © 2024 usagimaru 1024jp zumuya usagimaru Nobtaka macos-native.github.io “macOS native” community organizing (2018–)
4. © 2024 usagimaru try! Swift Tokyo
5. © 2024 usagimaru
6. © 2024 usagimaru User Interface Design
7. © 2024 usagimaru My Experiences
8. © 2024 usagimaru https://www.youtube.com/watch v=JCd8g6hFQiw Kid Pix Kid Pix / Classic Macintosh ׽ࣈTalk 6–7 (System 6–7 / Kanji Talk) Early 90s
9. ΫϦοΫͯ͠൓ԠΛָ͠Ή؝۩ w w w © 2024 usagimaru ౰࣌ͷࢲʹͱͬͯίϯϐϡʔλͱ͸ /CEKPVQUJ
10. © 2024 usagimaru https://en.wikipedia.org/wiki/Apple_pointing_devices https://ja.m.wikipedia.org/wiki/ిݯΩʔ Apple Mouse / Apple Keyboard with Power Key Early 90s
11. © 2024 usagimaru https://en.wikipedia.org/wiki/Apple_pointing_devices https://ja.m.wikipedia.org/wiki/ిݯΩʔ Apple Mouse / Apple Keyboard with Power Key Early 90s
12. © 2024 usagimaru Apple Mouse (1 Button) Early 90s Click! ! "
13. © 2024 usagimaru Other PC Mice (2 or 3 Buttons) Early 90s Which one??? PC ? #
14. © 2024 usagimaru iPhone 2007 Image: apple.com (2007)
15. © 2024 usagimaru Image: SparkFun Electronics www.flickr.com/photos/sparkfun/9465865873 >
16. © 2024 usagimaru Hardware Software OK Computer
17. © 2024 usagimaru Personal Computer
18. What is a great application? © 2024 usagimaru
19. © 2024 usagimaru Apple Platforms macOS iOS iPadOS watchOS tvOS visionOS
20. © 2024 usagimaru
21. © 2024 usagimaru Sharrow
22. © 2024 usagimaru mac OS
23. © 2024 usagimaru vision OS mac OS
24. © 2024 usagimaru 9:41 Right iOS Right Right
25. © 2024 usagimaru Consistency Forgiveness User Control Aesthetic Integrity Human Interface Guidelines (HIG) 1987
26. © 2024 usagimaru Human Interface Guidelines (HIG) https://developer.apple.com/design/human-interface-guidelines/ https://support.apple.com/guide/applestyleguide/welcome/web Apple Style Guide Editorial guidelines for Apple
27. © 2024 usagimaru Motions
28. © 2024 usagimaru System Standard View Transition
29. © 2024 usagimaru EaseInOut View Transition
30. © 2024 usagimaru 9:41 System EaseInOut View Transition Do not use EaseInOut UIKit Duration: Damping: Initial Velocity: 0.5 1.0 0.0 Spring Animation ௕͞ ݮਰ ॳ଎
31. © 2024 usagimaru 9:41 Same Animations UIKit https://developer.apple.com/documentation/uikit/uiview/1622635-perform System System
32. © 2024 usagimaru 9:41 Same Animations UIKit https://developer.apple.com/documentation/uikit/uiview/1622635-perform 9GECPWUGVJKUENQUWTG 0QGHHGEVU =7+8KGY? System System
33. © 2024 usagimaru 9:41 Duration: Bounce: Initial Velocity: 0.5 0.5 0.0 Spring Animation System Bounce (0.5) Bounce? For interactions with acceleration 0.0 = no bounce UIKit
34. © 2024 usagimaru
35. © 2024 usagimaru Release Drag… Projection Target Nearest Target (Destination) Initial Velocity (x) + Deceleration Bounce Move Accelerate Duration: Damping: Initial Velocity: 1.0 0.5 x Spring Animation UIKit
36. © 2024 usagimaru https://developer.apple.com/videos/play/wwdc2018/803/ “WWDC18 803 – Designing Fluid Interfaces”
37. © 2024 usagimaru ࡉ͔ͳڍಈ΍ઃܭࢥ૝Λ ᄿ͗औΔηϯεΛݚ͗੅·͢ $ API Look and Feel New Features HIG WWDC
38. © 2024 usagimaru Harmony
39. © 2024 usagimaru ௐ࿨ Harmony ܕഁΓ Unconventional +
40. © 2024 usagimaru Image: https://techcrunch.com/2012/03/27/pull-to-refresh-the-patent/
41. © 2024 usagimaru
42. © 2024 usagimaru कഁ཭ͷਫ਼ਆ Shu-Ha-Ri
43. © 2024 usagimaru ഁ Ha – Break क Shu – Learn ཭ Ri – Leave جຊʹ஧࣮ جຊͱಠࣗͷվྑ ಠࣗͷྲྀ೿ म ߦ ͷ ա ఔ ɹ https://ja.wikipedia.org/wiki/कഁ཭
44. © 2024 usagimaru จԽͷ൓ө
45. © 2024 usagimaru
46. © 2024 usagimaru զ ʑ ͸ จ ࣈ Λ ॎ ʹ ૊ Ή ज़ ΋ ࣋ ỳ ͯ ͍ Δ ೔ຊޠ͸ॎԣແਚʹ จࣈΛ഑ஔͰ͖Δ
47. © 2024 usagimaru
48. © 2024 usagimaru Image: https://commons.wikimedia.org/wiki/File:Neon-street-in-Tokyo-Japan.jpg Πϥετɿ@tobefrog
49. © 2024 usagimaru ͞Μͪͷख஽ʢத઒੓ࣣ঎ళʣ
50. © 2024 usagimaru https://www.flickr.com/photos/ktdm_jp/13051130174
51. © 2024 usagimaru ͞Μͪͷख஽ʢத઒੓ࣣ঎ళʣ
52. © 2024 usagimaru ͞Μͪͷख஽ʢத઒੓ࣣ঎ళʣ
53. © 2024 usagimaru ׽ ਺ ࣈ ॎ ॻ ͖ ৽ ݩ ߸ ࿨ ྐྵ ͞Μͪͷख஽ʢத઒੓ࣣ঎ళʣ
54. © 2024 usagimaru https://en.wikipedia.org/wiki/Japanese_era_name#/media/File:Keizo_Obuchi_cropped_Keizo_Obuchi_19890107.jpg https://ja.wikipedia.org/wiki/ྩ࿨#/media/ϑΝΠϧ:Yoshihide_Suga_announcing_new_imperial_era_Reiwa_2_(cropped).jpg Japanese Imperial Era ฏ੒ʢ1989–2019ʣ ྩ࿨ʢ2019–ʣ Heisei Era Reiwa Era
55. © 2024 usagimaru 7 A.D. ฏ੒ ࣣ 24 ೋे࢛ ฏ੒ DateFormatter: ɹݩ߸໊ͱ೥਺ΛऔಘɺiOSͷ৽ݩ߸ରԠΛ଴ͬͨ NumberFormatter: ɹࢉ༻਺ࣈ ခ ׽਺ࣈ 2020 32 ࡾेೋ
56. © 2024 usagimaru 7 A.D. ྩ࿨ɹ ࣣ 24 ೋे࢛ ྩ࿨ DateFormatter: ɹݩ߸໊ͱ೥਺ΛऔಘɺiOSͷ৽ݩ߸ରԠΛ଴ͬͨ NumberFormatter: ɹࢉ༻਺ࣈ ခ ׽਺ࣈ 2020 2 ೋ
57. © 2024 usagimaru ࣣ ೋ े ࢛ ೥ ݄ ೔ ྩ ࿨ ೋ
58. © 2024 usagimaru ͞Μͪͷख஽ʢத઒੓ࣣ঎ళʣ
59. © 2024 usagimaru ϓ ϥ ỽ τ ϑ Ỽ ồ Ϝ ͷ σ β Π ϯ ͱ ϧ ồ ϧ ✤ ௐ ࿨ ͱ ܕ ഁ Γ ✤ จ Խ ͷ ൓ ө ✤ Ϧ ε ϖ Ϋ τ ✤ Β ͠ ͍ ಈ ͖ iOS ✤
60. © 2024 usagimaru ੜ෺ɾਓྨɾຊೳ ݴޠɾԻɾҙຯ ਓछɾຽ଒ɾफڭ ࠃՈɾ஍Ҭɾ๏ɾ׳श ϓϥοτϑΥʔϜ ελΠϧ Culture Software Design? Design Organisms, Humans, Instincts Languages, Sounds, Meanings Races, Ethnicities, Religions Nations, Regions, Laws, Customaries Platforms Styles
61. © 2024 usagimaru ňΒ͠͞ʼnΛܧঝ͠ ਌͠Έ΍͍͢ܗΛͭ͘Ζ͏
62. try! Swift Tokyo