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

Patterns of UI Design

Patterns of UI Design

Ce1c5fa82c64054a797d4a97646e9b0f?s=128

Takuji Ikeda

May 16, 2013
Tweet

Transcript

  1. 6*σβΠϯͷύλʔϯԽ FOR SMART PHONE ஑ా୓࢘ 2013/05/16 CSS Nite @Co-Edo, Vol.11

    ͍ ͚ ͩ ɹ ͨ ͘ ͡
  2. ࣗݾ঺հ • ஑ా୓࢘ɹTakuji Ikeda • ΫοΫύουגࣜձࣾɹσβΠφʔ • εϚʔτϑΥϯαΠτͳͲͷαʔϏεσβΠϯΛ୲౰ σβΠϯͷந৅Խ΍ΨΠυϥΠϯԽ SassΛ༻͍ͨUIσβΠϯϑϨʔϜϫʔΫͷߏங

    • http://tikeda.net/ɹhttp://tikeda.hatenablog.com/ɹ • Twitter: @tikedaɹ
  3. ͜ͷηογϣϯʹ͍ͭͯ ຊηογϣϯͷେ࿮͸ɺ݄೔ʹൃച͞Εͨॻ੶ εϚʔτϑΥϯͷͨΊͷ6*σβΠϯ Ϣʔβʔମݧʹେ੾ͳϧʔϧͱύλʔϯ ͷ಺༰Λத৺ʹߦ͍·͢ɻ IUUQXXXBNB[PODPKQEQ

  4. AGENDA 1. UIͷύλʔϯԽɾϧʔϧԽͱ͸ 2. ϓϥοτϑΥʔϜͷྲّྀ 3. ը໘ύλʔϯ 4. UIίϯϙʔωϯτ 5.

    ࣮ફࣄྫ 6. ύλʔϯͱϧʔϧ͕΋ͨΒ͢ϝϦοτ
  5. 1 6*ͷύλʔϯԽɺϧʔϧԽͱ͸  6*ͷύλʔϯԽɾϧʔϧԽͱ͸  ϓϥοτϑΥʔϜͷྲّྀ  ը໘ύλʔϯ  6*ίϯϙʔωϯτ

     ࣮ફࣄྫ  ύλʔϯͱϧʔϧ͕΋ͨΒ͢ϝϦοτ
  6. 6*ͷύλʔϯԽɺϧʔϧԽͱ͸ • ը໘શମΛίϯϙʔωϯτ୯Ґʹ෼ׂ • ػೳ΍Ϣʔβʔମݧʹ߹Θ֤ͤͯίϯϙʔωϯτʹ ద੾ͳύλʔϯΛબͿ • ֤ίϯϙʔωϯτ͸ϓϥοτϑΥʔϜʹΑͬͯ ద੾ͳσβΠϯΛߟ͑Δ

  7. 6*ͷύλʔϯԽɺϧʔϧԽͱ͸ • ը໘શମΛίϯϙʔωϯτ୯Ґʹ෼ׂ ΞΫςΟϏςΟ χϡʔε ϗʔϜ ͓ؾʹೖΓ ͓஌Βͤ ઃఆ ͔͋͞Θ͞Μ͕ϑΥϩʔ͠·ͨ͠

    খྛ͞Μ͕͓ؾʹೖΓʹ௥Ճ͠·ͨ͠ ΄ͩ͞Μ͕ϑΥϩʔ͠·ͨ͠ ઒ଜ͞Μ͕͓ؾʹೖΓʹ௥Ճ͠·ͨ͠ ๺ඌ͞Μ͕ϑΥϩʔ͠·ͨ͠ ϝϞҰཡ Ωϟϯηϧ ެ։ઃఆ શһʹެ։ ͱ΋ͩͪʹެ։ ඇެ։ ֬ఆ λΠτϧ ௨஌͠ͳ͍ શһʹެ։ ൐͞Μ͕͓ؾʹೖΓʹ௥Ճ͠·ͨ͠ ᖒా͞Μ͕ϑΥϩʔ͠·ͨ͠ Ϟʔμϧ ΢Οϯυ΢ ϥδΦϘλϯ ςΩετϑΟʔϧυ όοΫφϏήʔγϣϯ λϒܕφϏήʔγϣϯ Ϧετ ϔομʔ ηάϝϯςου ίϯτϩʔϧ ΞΠίϯ ϑολʔ
  8. 6*ͷύλʔϯԽɺϧʔϧԽͱ͸ • ػೳ΍Ϣʔβʔମݧʹ߹Θ֤ͤͯίϯϙʔωϯτʹ ద੾ͳύλʔϯΛબͿ

  9. 6*ͷύλʔϯԽɺϧʔϧԽͱ͸ • ֤ίϯϙʔωϯτ͸ϓϥοτϑΥʔϜʹΑͬͯ ద੾ͳσβΠϯ͕ҟͳΔ৔߹͕͋Δ

  10. 6*ͷύλʔϯԽɺϧʔϧԽͱ͸ ύλʔϯA ύλʔϯB ύλʔϯC ίϯϙʔωϯτ ը໘ભҠ ը໘ભҠ ը໘ ಋೖ τοϓ

    Ұཡ ৄࡉ ೖྗɾ؅ཧ ϓϥοτϑΥʔϜʢiPhone App, Android App, Smartphone Siteʣ
  11. 6*ͷύλʔϯԽɺϧʔϧԽͱ͸ UIΛίϯϙʔωϯτԽͯ͠ߟ͑Δ͜ͱ͸ σβΠϯͷҾ͖ग़͠Λ૿΍͢͜ͱͱ΋ݴ͑Δ͕ 6*ߏங͢Δ্Ͱɺ αʔϏε։ൃΛ͢Δ্Ͱͷͭͷ ํ๏࿦

  12. 2 ϓϥοτϑΥʔϜͷྲّྀ  6*ͷύλʔϯԽɾϧʔϧԽͱ͸  ϓϥοτϑΥʔϜͷྲّྀ  ը໘ύλʔϯ  6*ίϯϙʔωϯτ

     ࣮ફࣄྫ  ύλʔϯͱϧʔϧ͕΋ͨΒ͢ϝϦοτ
  13. ϓϥοτϑΥʔϜͷྲّྀ iPhone Android iPhone App Android App Smart Phone Site

  14. ϓϥοτϑΥʔϜʹΑΔը໘ͷҧ͍ ৯΂ϩά Android App A B C Smart phone Site

    iPhone App
  15. 2VPSB iPhone App A B C Android App Smartphone Site

    ϓϥοτϑΥʔϜʹΑΔը໘ͷҧ͍
  16. 'BDFCPPL A B C Android App Smart phone Site ϓϥοτϑΥʔϜʹΑΔը໘ͷҧ͍

    iPhone App ? ? ?
  17. ? ϓϥοτϑΥʔϜʹԊ͏ϝϦοτͱ͸ʁ ϓϥοτϑΥʔϜ໰Θͣଗ͑ΔϝϦοτͱ͸ʁ

  18. ϓϥοτϑΥʔϜʹԊ͏৔߹ͷϝϦοτͷࣄྫ • ͍ͭ΋࢖ͬͯΔ΋ͷͱಉ͡UIʹ͢Δ͜ͱͰ Ϣʔβʔ͕ҧ࿨ײͳ͍ૢ࡞͕ՄೳʹͳΔ • ֤ϓϥοτϑΥʔϜͷಛ௃తͳػೳΛ࢖͏͜ͱ͕Ͱ͖Δ • ։ൃͷ෼཭͕͠΍͍͢

  19. ϓϥοτϑΥʔϜʹԊΘͳ͍৔߹ͷϝϦοτͷࣄྫ • Ϣʔβʔ͕ϓϥοτϑΥʔϜΛม͑ͯ΋ ͜Ε·Ͱ௨Γͷ࢖͍উखΛఏڙͰ͖Δ • ଍ฒΈΛἧ͑ͨػೳͷఏڙ΍ ϒϥϯσΟϯάΛ͢Δ͜ͱ͕Ͱ͖Δ • σβΠϯ΍։ൃͷϓϥοτϑΥʔϜΛ౷߹Ͱ͖Δ

  20. 3 ը໘ύλʔϯ  6*ͷύλʔϯԽɾϧʔϧԽͱ͸  ϓϥοτϑΥʔϜͷྲّྀ  ը໘ύλʔϯ  6*ίϯϙʔωϯτ

     ࣮ફࣄྫ  ύλʔϯͱϧʔϧ͕΋ͨΒ͢ϝϦοτ
  21. ৭ΜͳλΠϓͷΞϓϦͦͯ͠ ৭ΜͳλΠϓͷը໘͕͋Γ·͕͢

  22. ը໘ύλʔϯҰཡ ಋೖը໘ τοϓը໘ Ұཡը໘ ৄࡉը໘ ೖྗ ɾ ؅ཧը໘ छྨఔ౓ʁ 5

  23. ը໘ύλʔϯҰཡ ಋೖը໘ • εϓϥογϡ • ΢ΥʔΫεϧʔ • ίʔνϚʔΫ • ΤϯϓςΟϝοηʔδ

    τοϓը໘ • ϙʔλϧ • Ϣʔβʔ • ECɹ • ίʔϙϨΠτ Ұཡը໘ • ݕࡧ݁Ռ • λΠϜϥΠϯ • ΪϟϥϦʔ • ΞΫςΟϏςΟ ৄࡉը໘ • ࣸਅɾಈը • هࣄ • Ϛοϓ • ঎඼ ೖྗ ɾ ؅ཧը໘ • αΠϯΞοϓɾαΠϯΠϯ • ౤ߘ • ΧϝϥΩϟϓνϟ • ઃఆɾ؅ཧ छྨ 5 ֤ύλʔϯ
  24. ಋೖը໘ τοϓը໘ Ұཡը໘ ৄࡉը໘ ೖྗ ɾ ؅ཧը໘ ը໘ύλʔϯҰཡ छྨ͕େ׆༂ʂ 2

  25. Ұཡը໘ ݕࡧ݁Ռ λΠϜϥΠϯ ΪϟϥϦʔ

  26. ৄࡉը໘ هࣄ ࣸਅɾಈը ঎඼

  27. ݕࡧαʔϏε ΫοΫύου ʢSMART PHONE SITEʣ τοϓ Ұཡ Ұཡ ৄࡉ Ұཡ

    Ұཡ Ұཡ Ұཡ Ұཡ Ұཡ ݕࡧ݁Ռ ݕࡧ݁Ռ ΧςΰϦ αϒΧςΰϦ ఼ಊೖΓϨγϐ ΧςΰϦ ϨγϐҰཡ .:ϝχϡʔ Ϩγϐ αʔνϑΥʔϜ ηάϝϯςουίϯτϩʔϥ υϦϧμ΢ϯ υϦϧμ΢ϯ λϒܕφϏήʔγϣϯ ਨ௚ܕϦετ μογϡϘʔυ
  28. ը໘ΛύλʔϯԽ͢Δҙٛ • ໨తΛ͸͖ͬΓͱͤ͞Δ͜ͱͰγϯϓϧͰ εϐʔσΟͳը໘ઃܭ͕͠΍͘͢ͳΔ • ը໘ͱը໘ͷߦ͖དྷʢಋઢʣΛҙࣝͨ͠ UIίϯϙʔωϯτͷ഑ஔ͕Ͱ͖Δ • ։ൃ్தஈ֊Ͱ΋Ҿ͍ͨࢹ఺ͰϓϩδΣΫτΛ ݟͭΊ௚͢͜ͱ͕Ͱ͖Δ

  29. 4 6*ίϯϙʔωϯτ  6*ͷύλʔϯԽɾϧʔϧԽͱ͸  ϓϥοτϑΥʔϜͷྲّྀ  ը໘ύλʔϯ  6*ίϯϙʔωϯτ

     ࣮ફࣄྫ  ύλʔϯͱϧʔϧ͕΋ͨΒ͢ϝϦοτ
  30. 6*ίϯϙʔωϯτ • جຊίϯϙʔωϯτ • φϏήʔγϣϯ / ίϯτϩʔϧ • Ϧετ •

    ϑΥʔϜ • ϝοηʔδ • ৘ใͷϏδϡΞϧԽ • ΞΠίϯ • Ϟʔγϣϯ • ϏδϡΞϧελΠϧ
  31. جຊίϯϙʔωϯτ ଟ͘ͷεϚʔτϑΥϯΞϓϦ΍αΠτͰ ༻͍ΒΕ͍ͯΔɺը໘Λߏ੒͢Δ্Ͱ ͔ܽ͢͜ͱͷͰ͖ͳ͍جຊతͳ ϨΠΞ΢τཁૉ΍6*ཁૉɻ

  32. ϔομʔ wը໘ͷ্෦ͷΤϦΞ wJ1IPOFͰ͸φϏήʔγϣϯόʔɺ"OESPJEͰ͸ ϝΠϯΞΫγϣϯόʔͱݺͿɻΞϧϑΝΛ෇͚Δ৔߹΋͋Δ wݱࡏͷը໘΍λΠτϧΛࣔ͢ɻτοϓͰͳ͍৔߹͸ લͷը໘ʹ໭ΔφϏήʔγϣϯΛ഑ஔɻ ओཁͳΞΫγϣϯΛ഑ஔ͢Δ wεϚʔτϑΥϯαΠτͷ৔߹͸άϩʔόϧφϏήʔγϣϯͷ ໾ׂΛ୲͏ࣄ͕ଟ͍

  33. ϔομʔ

  34. λϒܕφϏήʔγϣϯ wJ1IPOFͰ͸φϏήʔγϣϯόʔɺ"OESPJEͰ͸ ϝΠϯΞΫγϣϯόʔͱݺͿɻΞϧϑΝΛ෇͚Δ৔߹΋͋Δ ը໘தԝʹը໘λΠτϧɻ ࠨଆʹલͷը໘ͷλΠτϧ໊ΛೖΕͨόοΫϘλϯɻ ӈଆʹओཁͳΞΫγϣϯϘλϯ ը໘ࠨଆʹը໘λΠτϧɻ ͦͷ͞ΒʹࠨʹόοΫϘλϯɻ ը໘ӈଆʹओཁͳΞΫγϣϯϘλϯ J1IPOFφϏήʔγϣϯόʔ

    "OESPJEϝΠϯΞΫγϣϯόʔ
  35. ௨஌ɾϝοηʔδ Ϣʔβʔ͕࣮ߦ͠Α͏ͱ͍ͯ͠Δߦಈ͕ ؒҧ͍Ͱ͸ͳ͍͔ࣄલʹܯࠂͯ֬͠ೝ͢Δ ͱ͖΍Ϣʔβʔ͕औͬͨߦಈͷޙʹ ϑΟʔυόοΫͯ͠΍ΓऔΓΛ͢Δͱ͖ ͳͲʹ༻͍·͢ɻ

  36. Ϟʔμϧϝοηʔδ wը໘ʹΦʔόʔϨΠ͢Δɻ ΞΫγϣϯΛ׬ྃͤ͞ͳ͍ݶΓ ݩͷը໘ͷૢ࡞͕Ͱ͖ͳ͍ wJ1IPOFͰ͸Ξϥʔτɺ"OESPJEͰ΋ ඪ४తʹ࢖ΘΕΔϝοηʔδύλʔϯɻ ಛʹ"OESPJEͷ৔߹ɺϞʔμϧ͸ ϝοηʔδʹݶΒͳͣར༻͞ΕΔ

  37. Ϟʔμϧϝοηʔδ w6*͚ͩͰ͸ͳ͘ར༻͢Δࡍ͸Ϙλϯͷϥϕϧʹ΋஫ҙ͕ඞཁ A B

  38. Ϟʔμϧϝοηʔδ w׬ྃϘλϯ͚ͩ wࣗಈతʹด͡Δ

  39. Ϟʔμϧϝοηʔδ wJ1IPOFͷ৔߹͸Ωϟϯηϧͷ Ґஔ͸ࠨଆͱ͸ݶΒͳ͍ wഁյߦҝͷଓߦ͸ࠨଆʹϘλϯ͕ ͘Δ͜ͱ΋͋Δ wͨͩ͠ɺڧௐ͞ΕΔϘλϯ͸ ӈଆʹݻఆ͞Ε͍ͯΔ J04)VNBO*OUFSGBDF(VJEFMJOF

  40. ϞʔυϨεϝοηʔδ wը໘ʹΦʔόʔϨΠ͢Δɻ ݩͷը໘ͷૢ࡞΋ࣗ༝ʹՄೳɻ ϝοηʔδ͸ࣗಈϑΣʔυΞ΢τ͢Δ w"OESPJEͰ͸5PBTU͕ඪ४తʹ࢖ΘΕΔ ϝοηʔδύλʔϯ

  41. ϞʔυϨεϝοηʔδ

  42. ? ϞʔμϧͷϝϦοτͱ͸ʁ ϞʔυϨεͷϝϦοτͱ͸ʁ

  43. ϞʔμϧͱϞʔυϨεͦΕͧΕͷར఺ͷࣄྫ wϢʔβʔͷߦಈΛࣄલʹ ஫ҙ͢Δͷʹద͍ͯ͠Δͷ͕ Ϟʔμϧɺࣄޙʹ֬ೝ͢Δͷ͕ ϞʔυϨε wϞʔμϧ͸࣮֬ʹϝοηʔδΛ ఻͑ΒΕΔ൓໘ɺଟ༻͢Δͱ ϢʔβʔʹετϨεɻ ϞʔυϨε͸࣮֬ʹ఻͑Δ ༻్ʹ͸޲͔ͳ͍ɻϢʔβʔͷ

    ҙਤͨ͠ߦಈͰ࢖͏ͷʹద͢
  44. ৘ใͷϏδϡΞϧԽ ৘ใΛϏδϡΞϧԽ͢Δ͜ͱͰจষͰ આ໌͢ΔͷͰ͸ͳ͘ແݴޠͰࢹ֮తʹ ෼͔Γ΍͘͢఻͑ΔͨΊͷޮՌ͕͋Γ·͢ɻ ·ͨϏδϡΞϧදݱΛ޻෉ָ͠͠͞΍ ໘ന͞ͷԋग़ޮՌ΋࣋ͪ߹Θ͍ͤͯ·͢ɻ

  45. ৘ใͷϏδϡΞϧԽ ಡΈࠐΈத ఺ ౦ژ౎ ਆಸ઒ݝ ઍ༿ݝ ࡛ۄݝ ܈അݝ ҵ৓ݝ

  46. ϨʔςΟϯά wίϯςϯπΛ౤ߘͨ͠Ϣʔβʔʹରͯ͠ϑΟʔυόοΫΛฦ͢ ʢධՁɾڞײͳͲʣ wίϯςϯπͷධՁΛୈࡾऀʹ఻͑Δ wࣗ෼ͷͨΊͷ෼ྨͱ͢Δ ϨΠςΟϯάͷओཁͳͭͷ໾ׂ

  47. ϨʔςΟϯά ϓϥεධՁͷΈ ϓϥεධՁͱϚΠφεධՁ දݱͷ෯͕ڱ͍ දݱͷ෯͕޿͍

  48. ϨʔςΟϯά w΋ͬͱ΋γϯϓϧͳදݱͳͷͰ ෼͔Γ΍͘͢ɺ ίετ΋௿͍ wʮ͍͍Ͷʂʯͱ͍͏ϥϕϦϯάʹ པΑΔ͜ͱͰίϯςϯπʹΑͬͯ ධՁ͠ʹ͍͕࣠͘ੜ·Ε ળ͠ѱ͠ΛܭΔ͜ͱʹ͸೉͍͠ wࣗ෼ͷͨΊͷ෼ྨʹ΋࢖͑ ར༻ൣғ͕޿͍

  49. ϨʔςΟϯά wྑ͍ධՁͱѱ͍ධՁΛ૬ରతʹ ݟΔ͜ͱ͕Ͱ͖ΔͷͰɺ ୈࡾऀʹͱͬͯ͸ίϯςϯπͷ ࣝผ͕͠΍͍͢ wѱ͍ධՁ΋Φʔϓϯʹ͓ͯ͘͠ ͜ͱͰɺίϯςϯπ౤ߘऀ͕ ѱ͍ධՁ͕ू·ΔͰ͋Ζ͏ ίϯςϯπͷ౤ߘΛ཈ࢭ͢Δ ޮՌ͕͋Δ

  50. ϨʔςΟϯά wແݴޠͰϨʔςΟϯάͷҙਤ΋ ಡΈऔΓ͕Մೳ wΞΠίϯΛ޻෉͢Δ͜ͱͰ ίϛϡχςΟΛָ͘͠ԋग़Ͱ͖ ੈք؍ͷߏங͕Մೳ

  51. ϨʔςΟϯά wஈ֊͕ෳ਺͋Δ͕ݸਓʹΑͬͯ ج४ͷײ͕֮ҟͳΔɻ ͦͷͨΊϨʔςΟϯά͢Δଆ͸ োน͕ߴ͍ wෳ਺ʹ౉ͬͯஈ֊͕͋ΔͨΊ ୈࡾऀ͕ड͚औΕΔ৘ใ͸ ଞͷύλʔϯΑΓ΋༗ӹ

  52. ΞΠίϯ ࢹ֮తͳϝλϑΝʔΛ༻͍ͯ ػೳ΍ը໘ͷ৅௃Λදݱͨ͠΋ͷɻ ϥϕϧʹཔΔ͜ͱͳ͘ࠃࡍతͰ ίϯύΫτͳ6*ΛߏஙͰ͖Δͷ͕ར఺ɻ ͔͠͠ແཧͳΞΠίϯԽ΍ແடংͳ ΞΠίϯ͸ࠞཚΛ༩͔͑Ͷͳ͍ɻ

  53. ΞΠίϯ A B C D E F G H I

    J
  54. ? ͦΕͧΕͷΞΠίϯͷ໾ׂ͸ʁ

  55. 6 ࣮ ફ ࣄ ྫ  6*ͷύλʔϯԽɾϧʔϧԽͱ͸  ϓϥοτϑΥʔϜͷྲّྀ 

    ը໘ύλʔϯ  6*ίϯϙʔωϯτ  ࣮ફࣄྫ  ύλʔϯͱϧʔϧ͕΋ͨΒ͢ϝϦοτ
  56. Engineer + Designer 50ਓ

  57. ࣮ફࣄྫ COOKPAD

  58. ࣮ફࣄྫ ΫοΫύου಺ͰͷύλʔϯԽɾϧʔϧԽͷ࣮ફ 1. COOKPAD UI Design Rules (Document) 2. COOKPAD

    UI Development Rules (Document) 3. COOKPAD CSS / Sass Coding Style (Document) 4. Sara Design Framework (Sass)
  59. ࣮ફࣄྫ COOKPAD UI Desgin Rules •Ϩγϐ΁ͷϦϯΫ৭͸྘ʹ͢Δ •ਨ௚ܕϦετίϯϙʔωϯτͰ Ϩγϐը૾ͷճΓࠐΈ͸جຊతʹࠨ •ϥϯΩϯάίϯϙʔωϯτͰ্ԼΛ ࣔ͢໼ҹͷ৭͸

    Ξοϓ͕ΦϨϯδɺμ΢ϯ͕ϒ ϧʔɺεςΠ͕ΞΠϘϦʔͱ͢Δ
  60. ࣮ફࣄྫ COOKPAD UI Desgin Rules PC Smartphone Site iPhone App

  61. ࣮ફࣄྫ Sara Design FrameworkʢSassʣ

  62. ࣮ફࣄྫ Sara Design FrameworkʢSassʣ

  63. ࣮ફࣄྫ Sara Design FrameworkʢSassʣ

  64. ࣮ફࣄྫ •UI͸ύλʔϯԽͰ͖ͯ΋Ϣʔβʔମݧ·ͰύλʔϯԽͯ͠ ϩδΧϧʹߟ͑Δ͜ͱ͸Ͱ͖ͳ͍ •ύλʔϯԽ͞ΕͨUIΛ༻͍ͯ΋ҙਤͨ͠࢖͍ํʹͳ͍ͬͯΔ͔͸ ։ൃऀͷཧղ͍ͩ͠ •ύλʔϯʹറΒΕ͗ͯ͢ɺඞཁͰ͋Δ΂͖ίϯϙʔωϯτ͕ ࡞ΒΕʹ͍͘ ՝୊ʹײ͍ͯ͡Δ͜ͱ υΩϡϝϯςʔγϣϯ΋େ੾ ͪΌΜͱߟ͑Δ͜ͱ͕େ੾

    ࣗ༝ͳൃ૝Ͱߟ͑Δ͜ͱ΋େ੾
  65. 7 ύλʔϯͱϧʔϧ͕΋ͨΒ͢ϝϦοτ  6*ͷύλʔϯԽɾϧʔϧԽͱ͸  ϓϥοτϑΥʔϜͷྲّྀ  ը໘ύλʔϯ  6*ίϯϙʔωϯτ

     ࣮ફࣄྫ  ύλʔϯͱϧʔϧ͕΋ͨΒ͢ϝϦοτ
  66. αʔϏε։ൃͰͷՁ஋ ։ൃνʔϜ ։ൃνʔϜ ։ൃνʔϜ • σβΠφʔ͕গͳ͍৔߹ σβΠφʔ ΤϯδχΞ ΤϯδχΞ ΤϯδχΞ

    ύλʔϯͱϧʔϧʹͷͬͱͬͨ6*ߏஙʹΑΓϦιʔεΛܰݮͯ͠ɺ ͦΕҎ֎ͷ৬छͷਓͰҰఆҎ্ͷΫΦϦςΟ·Ͱಋ͘ σΟϨΫλʔ σΟϨΫλʔ σΟϨΫλʔ ύλʔϯͱϧʔϧ
  67. ։ൃνʔϜ • ૊৫͕େ͖ͳ৔߹ σβΠφʔ ΤϯδχΞ ύλʔϯͱϧʔϧΛશελοϑ͕஌Δ͜ͱʹΑΓڞ௨ݴޠ΍ڞ௨ͷ Ձ஋؍Λϕʔεʹͨ͠։ൃ͕͠΍͘͢ͳΔ σΟϨΫλʔ ΤϯδχΞ ϓϩσϡʔαʔ

    σβΠφʔ σΟϨΫλʔ ύλʔϯͱϧʔϧ αʔϏε։ൃͰͷՁ஋
  68. ։ൃνʔϜ ։ൃνʔϜ ։ൃνʔϜ • ։ൃຖʹσβΠφʔ͕ผΕΔ৔߹ ύλʔϯͱϧʔϧ ΤϯδχΞ ΤϯδχΞ ΤϯδχΞ ҟͳΔϓϩδΣΫτͰ͋ͬͯ΋ɺύλʔϯ΍ϧʔϧ͸มΘΒͳ͍Α͏ʹ

    ͢Δ͜ͱͰɺϦιʔεͷܰݮɺϢʔβʔମݧͷඪ४Խ͕Ͱ͖Δ σΟϨΫλʔ σΟϨΫλʔ σΟϨΫλʔ σβΠφʔ σβΠφʔ σβΠφʔ αʔϏε։ൃͰͷՁ஋
  69. ։ൃνʔϜ • ܧଓతͳ։ൃΛଓ͚Δ৔߹ ύλʔϯͱϧʔϧ ΤϯδχΞ ύλʔϯ΍ϧʔϧΛ࣋ͭ͜ͱͰɺϢʔβʔ͔ΒಘͨϑΟʔυόοΫ͕ ՃΘΓΑΓՁ஋ͷߴ͍6*։ൃͷج൫Λ࣋ͭ͜ͱ͕Ͱ͖Δ σΟϨΫλʔ σβΠφʔ ։ൃνʔϜ

    ΤϯδχΞ σΟϨΫλʔ σβΠφʔ ։ൃνʔϜ ΤϯδχΞ σΟϨΫλʔ σβΠφʔ ύλʔϯͱϧʔϧ ύλʔϯͱϧʔϧ αʔϏε։ൃͰͷՁ஋
  70. ࠷ޙʹ • ύλʔϯ΍ϧʔϧԽͷಋೖ͸ͻͱͭͷํ๏࿦Ͱ͋ΓɺશͯͰ͸ͳ͍ • ύλʔϯ΍ϧʔϧʹ࢖ΘΕΔଆͰ͸ͳ͘࡞ͬͯߦཱ͘৔ͱͯ͠ ͍ͭ΋ΫϦΤΠςΟϒʹ • ։ൃํ๏ͱͯ͠ͷଊ͑ํ͚ͩͰ͸ͳ͘ɺ ϢʔβʔϝϦοτͷͨΊͰ͋Δ͜ͱΛ๨Εͣʹ •

    ύλʔϯԽ΍ϧʔϧԽͷٯɺʮҰաੑʯʮܳज़ੑʯʮݸੑʯͳͲ ϢχʔΫͳཁૉʹ΋໨Λ޲͚ɺ৺ऒ͔ΕΔσβΠϯΛ
  71. Ҏ্ɺ ͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ɻ ஑ా୓࢘ɹ!UJLFEBUBLVKJJLFEB!DPPLQBEDPN ΫοΫύουͰ͸ σβΠφʔɾΤϯδχΞΛ ੵۃ࠾༻தͰ͢ʂ ͝ڵຯ͋Δํ͸ੋඇΞΫηε͠ ͍ͯͩ͘͞ɻ ຊ೔ͷ಺༰ͷଟ͘͸ ʮεϚʔτϑΥϯͷ

    ͨΊͷ6*σβΠϯ Ϣʔβʔମݧʹඞཁͳ ϧʔϧͱύλʔϯʯ ͔Βൈਮ͍ͯ͠·͢ɻ http://info.cookpad.com/jobs/?affcd=eetmm http://www.amazon.co.jp/dp/4797372303/