Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Modelessness

Manabu Ueno
July 07, 2019

 Modelessness

Slides from my presentation at "macOS native symposium #04" on Jul 7, 2019.

Manabu Ueno

July 07, 2019
Tweet

More Decks by Manabu Ueno

Other Decks in Design

Transcript

  1. .PEFMFTTOFTT

    View Slide

  2. Apple ][ Human Interface Guidelines (pre-release) -- 1985 -- DigiBarn Computer Museum -- Apple Computer, Inc.
    Distributed under the Creative Commons License on page 4 Page 0001 of 0130

    View Slide


  3. View Slide


  4. View Slide


  5. I n s i d e M a c O S X
    Aqua
    Human Interface Guidelines
    Preliminary
    Macworld draft, 01/10/01

    View Slide

  6. OS X Human Interface
    Guidelines

    View Slide

  7. ϞʔυϨεωεΛ৴ไ͠ͳ͍͞
    Ϣʔβʔ͸൴൴ঁΒʹίϯτϩʔϧݖΛ༩͑ΔΞϓϦΛ޷Έɺ
    ·ͨ൴Β͔ΒසൟʹίϯτϩʔϧݖΛୣ͏ΞϓϦΛେ఍ݏ͍·
    ͢ɻϢʔβʔ͔ΒίϯτϩʔϧݖΛୣ͏࠷΋Ұൠతͳํ๏͸ɺ
    Ϣʔβʔʹಛఆͷਐ࿏Λڧཁ͢ΔϞʔυΛཚ༻͢Δ͜ͱͰ͢ɻ
    049)VNBO*OUFSGBDF(VJEFMJOFT

    View Slide

  8. View Slide

  9. ίϯϐϡʔλ
    ϢʔβʔϩάΠϯ
    ΞϓϦέʔγϣϯ
    ΢Οϯυ΢
    ίϯτϩʔϧ
    Ωʔೖྗ
    ʜ
    Ϟʔυ͸ίϯϐϡʔλͷݪࡑ

    View Slide

  10. .PEFWT.PEFMFTT

    View Slide

  11. NBHMJUFDPN

    View Slide

  12. 0''
    0/
    0''
    0/
    0/
    0/
    0''
    0/

    View Slide

  13. Ϟʔυ
    ૢ࡞ͷҙຯΛγεςϜ͕ዞҙతʹنఆʗมߋ͍ͯ͠Δঢ়ଶ
    Ϟʔυ͸ϢʔβʔΛಛఆͷ৔ॴ΍ϑϩʔʹറΓɺϢʔβʔ͸͋Δܾ
    ·ͬͨૢ࡞Λ͢Δ·Ͱ͔ͦ͜Βൈ͚ग़͢͜ͱ͕Ͱ͖ͳ͍
    Ϟʔυ͸ɺ؀ڥΛίϯτϩʔϧ͍ͨ͠ͱ͍͏զʑͷجຊతͳཉٻʹ൓
    ͢ΔͨΊɺετϨεʹͳΔ

    View Slide

  14. lϞʔυΤϥʔ͸ɺ૷ஔ͕͍͔ͭ͘ҟͳΔૢ࡞ϞʔυΛ΋͍ͬͯͯɺ
    ͋ΔϞʔυͰద੾ͳߦҝ͕ଞͷϞʔυͰ͸ҧ͏ҙຯΛ΋ͭΑ͏ͳͱ͖
    ʹੜ͡ΔɻϞʔυΤϥʔ͸ɺͦͷ૷ஔ͕΋͍ͬͯΔ੍ޚεΠον΍ද
    ࣔͷ਺ΑΓ΋ɺ࣮ߦՄೳͳߦҝͷ਺ͷํ͕ଟ͘ɺͦΕΏ͑Ұͭͷε
    Πον͕ೋͭͷ໾ׂΛՌ͍ͯ͠Δ૷ஔͰ͸͍ͭͰ΋ੜ͡͏Δɻz
    υφϧυɾϊʔϚϯ

    View Slide

  15. .PEBM .PEFMFTT
    XJLJQFEJBDPN

    View Slide

  16. XJLJQFEJBDPN
    .PEBM .PEFMFTT

    View Slide







  17. .PEBM .PEFMFTT

    View Slide

  18. .PEBM .PEFMFTT

    View Slide

  19. .PEBM .PEFMFTT

    View Slide

  20. .PEBM .PEFMFTT

    View Slide

  21. .PEBM .PEFMFTT

    View Slide

  22. .PEBM .PEFMFTT

    View Slide

  23. .PEBM .PEFMFTT

    View Slide

  24. .PEBM .PEFMFTT

    View Slide

  25. lࢲ͸ɺΠϯλϑΣʔε͕ϞʔυΛ࣋ͨͣɺ͔ͭɺՄೳͳݶΓϞϊτφ
    εͰ͋Ε͹ɺͦͷଞશͯͷσβΠϯ͕ݱ୅ͷΠϯλϑΣʔεਫ४͔Β
    ݟͯฏۉతͳ΋ͷͰ͋ͬͯ΋ɺܶతʹ࢖͍΍͍͢΋ͷͱͳΔͱ৴ͯ͡
    ͍·͢ɻʢதུʣϞʔυ͕ແ͘Ϟϊτχʔʹج͍ͮͨ੡඼Λ࢖༻͢Δ
    ͜ͱʹΑͬͯɺ΄ͱΜͲපΈ͖ͭͱ΋ݴ͑Δश׳͕ܗ੒͞Εɺ੡඼Λ
    Ѫ͢ΔϢʔβਓޱ΋૿Ճ͍ͯ͘͜͠ͱͰ͠ΐ͏ɻz
    δΣϑɾϥεΩϯ

    View Slide

  26. View Slide

  27. $PNNBOE-JOF*OUFSGBDF
    7FSCˠ0CKFDU
    ίϯϐϡʔλʹରͯ͠ɺӳޠͷ໋ྩจͰॲཧΛࢦࣔ͢ΔʢίϚϯυˍλΠϐϯάʣ
    ίϯϐϡʔλΛɺ௨࣌తʗݴޠతͳ΋ͷͱͯ͠ଊ͑ͨૢ࡞ମܥʢϞʔμϧʣ

    View Slide

  28. 4LFUDIQBE
    ೥ʹΞΠόϯɾαβϥϯυ͕։ൃͨ͠ɻ
    ը໘ʹදࣔ͞ΕͨάϥϑΟοΫΛ௚઀తʹૢ
    ࡞͢Δͱ͍͏ɺ(6*ͷΞΠσΞͷىݯɻ
    άϥϑΟοΫΦϒδΣΫτ
    ϥΠτϖϯ
    XJLJQFEJBPSH

    View Slide

  29. FYUSFNFUFDIDPN
    ೥୅ʹμάϥεɾΤϯήϧόʔτ཰͍Δ
    ݚڀऀνʔϜ͕։ൃͨ͠ɻ
    ϏοτϚοϓσΟεϓϨΠ
    Ϛ΢ε
    ϋΠύʔςΩετ
    /-4

    View Slide

  30. ೥୅ʹΞϥϯɾέΠΛத৺ʹ9FSPY
    1"3$Ͱ։ൃ͞Εͨɻ
    ΦϒδΣΫτࢦ޲ˍ(6*ϕʔεͷ04
    ύʔιφϧίϯϐϡʔλͷ࠷ॳͷ׬੒ܗ
    σεΫτοϓϝλϑΝ
    Φʔόʔϥοϐϯά΢Οϯυ΢
    ϓϩάϥϛϯά؀ڥ
    !TVNJN
    4NBMMUBML

    View Slide

  31. 5FTMFS
    -BSSZ

    View Slide

  32. IUUQTZPVUVCF%IN[$**:

    View Slide

  33. l"QFSTPOBMIJTUPSZPGNPEFMFTTUFYUFEJUJOHBOEDVUDPQZQBTUFz-BSSZ5FTMFS

    View Slide

  34. View Slide

  35. (SBQIJDBM6TFS*OUFSGBDF 0CKFDU0SJFOUFE6TFS*OUFSGBDF

    0CKFDUˠ7FSC
    ର৅ʹରͯ͠ɺಇ͖ΛδΣενϟͰࢦࣔ͢ΔʢάϥϑΟοΫˍϙΠϯςΟϯάʣ
    ίϯϐϡʔλΛɺڞ࣌తʗۭؒతͳ΋ͷͱͯ͠ଊ͑ͨૢ࡞ମܥʢϞʔυϨεʣ

    View Slide

  36. l4NBMMUBMLͷΦϒδΣΫτࢦ޲ੑ͸ඇৗʹࣔࠦతͰ͋ͬͨɻʢதུʣ
    ந৅తͳγϯϘϧͷ৔Ͱ͸ɺͦΕ͸ɺ࠷ॳʹΦϒδΣΫτ໊Λهड़͠
    ͯͦͯͦ͠ΕʹԿΛ͢Δ͔Λࢦࣔ͢ΔϝοηʔδΛ෇͚Δɻ۩ମతͳ
    ϢʔβʔΠϯλʔϑΣʔεͷ৔Ͱ͸ɺͦΕ͸࠷ॳʹΦϒδΣΫτΛબ
    ୒͢Δ͜ͱΛҙຯ͍ͯ͠ΔɻͦΕ͔ΒԿ͕͍ͨ͠ͷ͔Λϝχϡʔʹ
    Αͬͯఏࣔ͢ΔɻͲͪΒͷ৔߹Ͱ΋ɺΦϒδΣΫτ͕ઌͰ͋Γɺ΍Γ
    ͍ͨ͜ͱ͕ͦͷ࣍ͱͳ͍ͬͯΔɻ͜Ε͸۩ମతͳ΋ͷͱந৅తͳ΋ͷ
    ͱΛߴ͍࣍ݩͰ౷߹͍ͯ͠Δɻz
    ΞϥϯɾέΠ

    View Slide

  37. lΦϒδΣΫτࢦ޲ϓϩάϥϛϯά͸ɺίϯϐϡʔλ͸ਓؒͷਫ਼ਆΛ֦ு͠
    ͨ΋ͷͰ͋Δͱ͍͏Τϯήϧόʔτͷߏ૝͔Βੜͨ͡ɻΞϥϯɾέΠͷ
    %ZOBCPPLߏ૝͸͠͹͠͹ۙ୅ʹ͓͚Δϥοϓτοϓ1$ͷઌۦͱ໨͞Εͯ
    ͍Δ΋ͷ͕ͩɺ͜Ε͸͜ͷΑ͏ͳߏ૝ͷయܕͩͱݴ͑Α͏ɻʢதུʣέΠ
    ͸ޙʹ͜ͷߏ૝Λιʔείʔυʹ·Ͱ࣋ͪࠐΉͨΊʹɺݴޠΛ࡞͍ͬͯ
    ΔɻͦΕ͕4NBMMUBMLͰ͋Δɻࣄ࣮ɺΦϒδΣΫτࢦ޲ϓϩάϥϛϯάʹ͓
    ͚Δઌۦऀͨͪͷ໨త͸ɺΤϯυϢʔβͷϝϯλϧϞσϧΛίʔυʹ͓͍
    ͯͱΒ͑Δ͜ͱͩͬͨɻ͜ΕΒͷߏ૝͕ࠓ೔ͷΘΕΘΕʹ࢒ͯ͘͠Εͨͷ
    ͸ɺΠϯλϥΫςΟϒͰάϥϑΟΧϧͳϢʔβΠϯλϑΣʔεͱɺੈͷத
    ͷϓϩάϥϛϯάʹ͓͚ΔΦϒδΣΫτࢦ޲ݴޠͷོ੝Ͱ͋Δɻz
    τϦάϰΣɾϦʔϯεΧ΢Ϋ

    View Slide

  38. ϞʔυϨεωεͷݪଇ
    0CKFDU7FSCͷૢ࡞ߏจ
    ର৅͕ݟ͍͑ͯͯɺ೚ҙͷॱংͰΞΫηεͰ͖Δ
    ௚઀త͔ͭՄٯతͳૢ࡞
    ঢ়ଶมԽΛϦΞϧλΠϜʹϑΟʔυόοΫ͢Δ

    View Slide

  39. $PDPB

    View Slide

  40. .VMUJ5BTLJOH
    ΞϓϦέʔγϣϯ͸ৗʹ'PSFHSPVOEɻ
    ΞϓϦέʔγϣϯʗ΢Πϯυ΢͸*OBDUJWFͰ΋
    ಈ͖ଓ͚Δɻ
    IUUQTEFWFMPQFSBQQMFDPNMJCSBSZBSDIJWFEPDVNFOUBUJPO(FOFSBM$PODFQUVBM
    .049"QQ1SPHSBNNJOH(VJEF$PSF"QQ%FTJHO$PSF"QQ%FTJHOIUNM

    View Slide

  41. 3VO-PPQT
    3VOMPPQ͸εϨουʹ෇ਵ͢ΔجຊతͳΠϯϑ
    ϥετϥΫνϟͷҰ෦Ͱ͢ɻ3VOMPPQ͸ɺ࡞ۀ
    Λεέδϡʔϧͯ࣍͠ʹདྷΔΠϕϯτͷड৴Λ
    ௐ੔͢ΔͨΊʹ࢖༻͢ΔΠϕϯτॲཧϧʔϓͰ
    ͢ɻ
    IUUQTEFWFMPQFSBQQMFDPNMJCSBSZBSDIJWFEPDVNFOUBUJPO$PDPB$PODFQUVBM
    .VMUJUISFBEJOH3VO-PPQ.BOBHFNFOU3VO-PPQ.BOBHFNFOUIUNM

    View Slide

  42. 'JSTU3FTQPOEFST
    'JSTUSFTQPOEFS͸ҰൠʹɺϢʔβʔ͕Ϛ΢ε·
    ͨ͸ΩʔϘʔυͰબ୒·ͨ͸ΞΫςΟϒԽ͢Δ
    ϢʔβʔΠϯλʔϑΣʔεΦϒδΣΫτͰ͢ɻ
    ͦΕ͸௨ৗɺΠϕϯτ·ͨ͸ΞΫγϣϯϝο
    ηʔδΛड৴͢ΔϨεϙϯμνΣʔϯ಺ͷ࠷ॳ
    ͷΦϒδΣΫτͰ͢ɻ
    IUUQTEFWFMPQFSBQQMFDPNMJCSBSZBSDIJWFEPDVNFOUBUJPO$PDPB$PODFQUVBM
    &WFOU0WFSWJFX&WFOU"SDIJUFDUVSF&WFOU"SDIJUFDUVSFIUNM

    View Slide

  43. 0CKFDU7FSC4ZOUBY
    ॲཧΛಛఆ͢Δલʹର৅Λબ୒͢Δ͜ͱ͸ɺ
    .BDJOUPTIώϡʔϚϯΠϯλʔϑΣʔεͷجຊ
    తͳಛ௃Ͱ͢ɻ
    Ϣʔβʔ͕ର৅ʢ໊ࢺʣΛબ୒

    Ϣʔβʔ͕ॲཧʢಈࢺʣΛબ୒
    ͜Ε͸l໊ࢺಈࢺύϥμΠϜzͱݺ͹Ε·͢ɻ
    l4FMFDUJOHz.BDJOUPTI)VNBO*OUFSGBDF(VJEFMJOFT


    View Slide

  44. 5BSHFU"DUJPO
    ϢʔβʔΠϯλʔϑΣΠε্ͷίϯτϩʔϧͷ
    ໾ׂ͸γϯϓϧͰ͢ϢʔβʔͷҙਤΛղऍ͠ɺ
    ͦͷཁٻΛ࣮ߦ͢ΔΑ͏ʹଞͷΦϒδΣΫτʹ
    ࢦࣔ͢Δ͜ͱͰ͢ɻ
    5BSHFU"DUJPOͷϝΧχζϜʹΑΓɺίϯτϩʔ
    ϧʢηϧʣ͸ɺΞϓϦέʔγϣϯݻ༗ͷ໋ྩΛ
    ద੾ͳΦϒδΣΫτ΁ૹΔͷʹඞཁͳ৘ใΛΧ
    ϓηϧԽͰ͖·͢ɻ
    IUUQTEFWFMPQFSBQQMFDPNMJCSBSZBSDIJWFEPDVNFOUBUJPO(FOFSBM$PODFQUVBM
    $PDPB&ODZDMPQFEJB5BSHFU"DUJPO5BSHFU"[email protected]
    51$)48
    aButton.title = @"Button";
    aButton.target = aTargetObject;
    aButton.action = @selector(doSomething:);

    View Slide

  45. %SBHBOE%SPQ
    $PDPBΛ࢖༻͢ΔͱɺΞϓϦέʔγϣϯ಺ͱΞ
    ϓϦέʔγϣϯؒͷ྆ํͰߴ౓ͳυϥοάΞϯ
    υυϩοϓػೳΛ࣮૷Ͱ͖·͢ɻ
    /4%SBHHJOH4PVSDF
    /4%SBHHJOH*UFN
    /4%SBHHJOH4FTTJPO
    /4%SBHHJOH%FTUJOBUJPO
    /4%SBHHJOH*OGP
    IUUQTEFWFMPQFSBQQMFDPNMJCSBSZBSDIJWFEPDVNFOUBUJPO$PDPB$PODFQUVBM
    %SBHBOE%SPQ%SBHBOE%[email protected]
    %SBH
    %SBHHJOH
    4PVSDF
    1BTUFCPBSE
    %SBHHJOH
    %FTUJOBUJPO
    %SPQ
    %SBHHJOH
    4FTTJPO

    View Slide

  46. "VUPTBWJOH
    ͋ͳͨ͸ৗʹɺσʔλʹՃ͑ΒΕͨมߋͷอଘ
    ΛϢʔβʔ͕खಈͰߦ͏͜ͱΛڧཁ͠ͳ͍Α͏
    ʹ͠·͢ɻͦͷ͔ΘΓɺࣗಈσʔλอଘΛ࣮૷
    ͍ͯͩ͘͠͞ɻ/4%PDVNFOUͷϚϧν΢Πϯυ
    ΢ΞϓϦͰ͸ɺࣗಈอଘ͸؆୯Ͱ͢ɻ
    ΞϓϦ͕ऴྃ͢Δ࣌
    ΞϓϦ͕EFBDUJWBUF͞ΕΔ࣌
    ΞϓϦΛӅͨ࣌͠
    ΞϓϦ಺Ͱσʔλ͕มߋ͞Εͨ࣌
    IUUQTEFWFMPQFSBQQMFDPNMJCSBSZBSDIJWFEPDVNFOUBUJPO(FOFSBM$PODFQUVBM
    .049"QQ1SPHSBNNJOH(VJEF$PSF"QQ%FTJHO$PSF"QQ%FTJHOIUNM

    View Slide

  47. $PDPB#JOEJOHT
    $PDPBCJOEJOHT͸ɺϞσϧ͕ΞϓϦέʔγϣϯ
    σʔλΛΧϓηϧԽ͠ɺϏϡʔ͕σʔλͷදࣔ
    ͱฤूΛߦ͍ɺͦͯ͠ίϯτϩʔϥʔ͕྆ऀͷ
    ؒΛऔΓ࣋ͭͱ͍͏ɺ.PEFM7JFX$POUSPMMFSύ
    ϥμΠϜΛΞϓϦέʔγϣϯ಺Ͱ׬શʹ࣮૷͢
    ΔͨΊͷςΫϊϩδʔͷू·ΓͰ͢ɻ
    IUUQTEFWFMPQFSBQQMFDPNMJCSBSZBSDIJWFEPDVNFOUBUJPO$PDPB$PODFQUVBM
    $PDPB#JOEJOHT$PDPB#JOEJOHTIUNM

    View Slide

  48. 0CKFDU$POUSPMMFS
    $PDPBCJOEJOHTʹରԠͨ͠ίϯτϩʔϥʔɻί
    ϯςϯτΦϒδΣΫτͷϓϩύςΟΛϢʔβʔ
    ΠϯλʔϑΣʔεཁૉʹόΠϯυ͠ɺ஋΁ͷΞ
    ΫηεͱมߋΛՄೳʹ͢Δɻ
    /40CKFDU$POUSPMMFS
    /4"SSBZ$POUSPMMFS 5BCMF7JFX

    /45SFF$POUSPMMFS 0VUMJOF7JFX

    5BCMF$PMVNO
    %BUB"SSBZ
    "SSBZ$POUSPMMFS
    5FYU'JFME
    5FYU'JFME
    selectedObjects[0]
    IUUQTEFWFMPQFSBQQMFDPNEPDVNFOUBUJPOBQQLJUOTPCKFDUDPOUSPMMFS

    View Slide

  49. 3FQSFTFOUFE0CKFDU
    ͜ͷϓϩύςΟ͸ࢦఆ͞ΕͨΦϒδΣΫτΛϦ
    ςΠϯ͠·͢ɻίϐʔͰ͸͋Γ·ͤΜɻͭ·Γ
    Ϩγʔόʔ͸ද৅͞ΕͨΦϒδΣΫτͱରͷ
    ؔ܎Λ࣋ͪɺΞτϦϏϡʔτͱͯ͠ॴ༗͸͠·
    ͤΜɻ
    SFQSFTFOUFE0CKFDU͔Β࢝·ΔΩʔύεΛ࢖ͬ
    ͯɺ7JFX$POUSPMMFSʢଞʣͱίϯτϩʔϧΛό
    ΠϯυͰ͖·͢ɻ
    IUUQTEFWFMPQFSBQQMFDPNEPDVNFOUBUJPOBQQLJUOTWJFXDPOUSPMMFS
    SFQSFTFOUFEPCKFDU
    "SSBZ$POUSPMMFS
    selectedObjects[0]
    .FOV*UFN
    representedObject
    7JFX$POUSPMMFS
    representedObject

    View Slide

  50. $PNCJOF
    $PNCJOF͸࣌ؒͷܦաͱͱ΋ʹ஋Λॲཧ͢Δͨ
    Ίͷ౷ҰతͳએݴܕϑϨʔϜϫʔΫͰ͢ɻωο
    τϫʔΩϯάɺ,FZ7BMVF؂ࢹɺ௨஌ɺίʔϧ
    όοΫͳͲͷඇಉظίʔυΛ୯७Խ͠·͢ɻ
    1VCMJTIFSσʔλΛੜ੒͢Δ
    4VCTDSJCFSσʔλΛड͚औΔ
    0QFSBUPSσʔλͷ߹੒΍Ճ޻Λߦ͏
    IUUQTEFWFMPQFSBQQMFDPNWJEFPTQMBZXXED
    IUUQTEFWFMPQFSBQQMFDPNWJEFPTQMBZXXED
    NEW

    View Slide

  51. 8SBQVQ

    View Slide

  52. View Slide

  53. .PEFMFTTBOE.PEBM

    IUUQTNPEFMFTTEFTJHODPNNPEFMFTTBOENPEBM
    ϞʔυϨε͸Ͳ͔͜Βདྷ͔ͨrΦϒδΣΫτࢦ޲6*ͷىݯr

    IUUQTNPEFMFTTEFTJHODPNCBDLESPQ
    ϞʔυϨεɾϢʔβʔΠϯλʔϑΣʔε

    IUUQTXXXTPDJPNFEJBDPKQ
    0069rΦϒδΣΫτϕʔεͷ6*ϞσϦϯά

    IUUQTXXXTPDJPNFEJBDPKQ
    006*ͷ໨౰ͯ

    IUUQTXXXTPDJPNFEJBDPKQ
    "IJTUPSZPG"QQMF)*(UBCMFPGDPOUFOUTrUIFQIJMPTPQIZBOEQSJODJQMFT

    IUUQTNPEFMFTTEFTJHODPNCBDLESPQ
    5XJUUFS

    !NBOBCVVFOP

    View Slide

  54. .BOBCV6FOP

    View Slide