課題と向き合ったフリルのWebリニューアル

by Yuki Haruyama

Slide 1

Slide 1 text

՝୊ͱ޲͖߹ͬͨ  8FC൛ϑϦϧϦχϡʔΞϧ

Slide 2

Slide 2 text

2 Fablic, inc. Product Manager, Designer ࢁޱ༗༝ر @yuki930 ϓϩϑΟʔϧ

Slide 3

Slide 3 text

3 ϑϦϧ '3*- ʮཉ͍͠ʯ͕Έ͔ͭΔϑϦϚΞϓϦ

Slide 4

Slide 4 text

Slide 5

Slide 5 text

ϑϦϧ8FCϦχϡʔΞϧ  ϓϩδΣΫτʹ͍ͭͯ 5

Slide 6

Slide 6 text

6 ͣͬͱΞϓϦϑΝʔετͩͬͨϑϦϧ ௕Β͘ख෇͔ͣͩͬͨ8FC൛

Slide 7

Slide 7 text

7 ࠷దԽ͢Δ͜ͱͰ΋ͬͱྲྀೖऀ਺Λ૿΍ͤΔͷͰ͸ʜʁ 8FC͸௕͍͍͋ͩ؆қతͳ΋ͷʹͳ͍ͬͯͨɻ ͣͬͱΞϓϦϑΝʔετͩͬͨϑϦϧ

Slide 8

Slide 8 text

8 ͣͬͱΞϓϦϑΝʔετͩͬͨϑϦϧ ؆қతͳ঎඼঺հϖʔδͱ͔ͯ͠͠ػೳ͍ͯ͠ͳ͔ͬͨɻ  ߪೖ͍ͨ͠৔߹͸ΞϓϦμ΢ϯϩʔυˠొ࿥ˠ঎඼Λ୳͢ˠߪೖͱ͍͏εςοϓ 8FCͷΈͰ׬݁͢Ε͹΋ͬͱߪೖ཰͸͕͋ΔͷͰ͸ʜʁ εςοϓ͕ଟ͍ʜ ʜ

Slide 9

Slide 9 text

9 ͣͬͱΞϓϦϑΝʔετͩͬͨϑϦϧ 8FC͖͔͚ͬͷϢʔβʔɺ  ΋ͬͱ૿΍ͤΔΜ͡Όͳ͍ʁ

Slide 10

Slide 10 text

10 νʔϜϝϯόʔ اըɾσβΠϯ ϑϩϯτΤϯυ αʔόʔαΠυ ࣮૷ αʔόʔαΠυ ࣮૷ ΞαΠϯ͞Εͨͷ͸໊ ࢲ ͍͢͝ ͍͢͝

Slide 11

Slide 11 text

11 ͱ͸͍͑ɺͲΕ͙Β͍Մೳੑ͕͋Δʁ ݱঢ়෼ੳௐࠪ

Slide 12

Slide 12 text

12 ௐࠪͷ࣠ ݕࡧྲྀೖͷ࠷େԽ ߪೖಈઢͷ࠷దԽ ·ͣ͸ϑϦϧͷݱঢ়Λ஌Δ ଞαΠτͷ܏޲΍੒௕཰Λௐ΂ͯϲ݄ޙʹ࣮ݱՄೳͳ஋Λ୳Δ ݱঢ়ͷϑϩʔͰͷߪೖίϯόʔδϣϯ཰Λ஌Δ &$αΠτͷίϯόʔδϣϯ཰Λௐࠪ͠ɺൺֱ͢Δ

Slide 13

Slide 13 text

13 ݕࡧྲྀೖͷ࠷దԽ ·ͣ͸ϑϦϧͷݱঢ়Λ஌Δ "OBMZUJDTΛ࢖ͬͯௐࠪ ݱঢ়Կਓ͙Β͍ͷ66͕͍Δͷ͔ʁ ྲྀೖܦ࿏ͷ಺༁͸ʁ ͲͷϖʔδάϧʔϓʹҰ൪ଟ͘  ϥϯσΟϯά͍ͯ͠ΔʁͳͲΛ֬ೝ σʔλ͸ܧଓͯ͠௥͑ΔΑ͏ʹ͓ͯ͘͠

Slide 14

Slide 14 text

14 ݕࡧྲྀೖͷ࠷దԽ ϲ݄ޙͷ໨ඪͱͯ͠ݱ࣮తͳϥΠϯΛ୳Δ 4JNJMBS8FCΛ࢖ͬͯௐࠪ ڝ߹ͷΞΫηε਺͸ͲΕ͙Β͍ʁ ྲྀೖܦ࿏͸ʁ ݱ࣮తͳ໨ඪϥΠϯ͸ʁ ࣮ݱՄೳͳ໨ඪ஋Λ୳Δ

Slide 15

Slide 15 text

15 ߪೖಈઢͷ࠷దԽ ΞΫηεͯ͠ ʜ ̋̋̋̋̋̋̋̋ʜ̋̋ ߪೖϘλϯΛԡ͠ %-ϖʔδ΁ߦ͖ %-ͯ͠ ߪೖ͢Δ ݱঢ়ͷϑϩʔͰͷߪೖίϯόʔδϣϯ཰Λௐࠪ

Slide 16

Slide 16 text

16 ߪೖಈઢͷ࠷దԽͷͨΊͷௐࠪ ݱঢ়ͷ཭୤ϙΠϯτͱίϯόʔδϣϯ཰Λચ͍ग़͢ σʔλࢀরݩ ̋̋̋ਓ͕๚໰͍ͯͯ͠ ̋̋̋ਓ͕ߪೖϘλϯΛԡ͍ͯͯ͠ ̋̋̋ਓ͕ΞϓϦΛμ΢ϯϩʔυ͍ͯͯ͠ ̋̋̋ਓ͕ձһొ࿥Λ͍ͯͯ͠ ̋̋̋ਓ͕ߪೖΛ͍ͯ͠Δ͔

Slide 17

Slide 17 text

17 ߪೖಈઢͷ࠷దԽ &$αΠτͷΧʔτίϯόʔδϣϯ཰Λௐࠪ IUUQGUSBDPNKBCMPHPWFSTFBT &$αΠτͷΧʔτ์غ཰ͳͲͷσʔλΛௐࠪɺ  ࢀߟ஋ͱ͍͔ͯͭ͘͠ϐοΫΞοϓ ݱঢ়ͷϑϦϧͷίϯόʔδϣϯ཰ͱൺֱ͠ɺ  ͲͪΒ͕༏Ґͳͷ͔νΣοΫ

Slide 18

Slide 18 text

18 ௐࠪ෼ੳ ྲྀೖͱߪೖ·ͰͷΞΫγϣϯΛվળ͢Δ͜ͱͰ  େ͖͘৳ͼΔݟࠐΈ͕͋Δͱ൑அͰ͖Δࡐྉ͕ू·ͬͨ ͜ΕΒͷ෼ੳ݁Ռ͔ΒࢦඪΛԾஔ͖͠ɺࢼࢉ

Slide 19

Slide 19 text

19 ࠓճͷϓϩδΣΫτͷ໨ඪ͕ܾఆ ݕࡧྲྀೖͷ࠷େԽ ߪೖಈઢͷ࠷దԽ ݄࣌఺ͰΦʔΨχοΫ66̋̋̋ਓΛୡ੒͢Δ վળʹΑ্͕ͬͯΔ܏޲Λ௫Ή 8FC্Ͱߪೖ͕׬݁͢ΔΑ͏ͳ69Λఏڙ͢Δ ࢀߟ஋ͱͯ͠ग़ͨ͠&$αΠτͷίϯόʔδϣϯ཰Λࢦඪͱ͠ɺݱঢ় ͷίϯόʔδϣϯ཰͔Β̋ˋΞοϓΛ໨ࢦ͢

Slide 20

Slide 20 text

20 ໨ඪʹ޲͔͏ͨΊʹ  ΍Δ΂͖͜ͱ΍Βͳ͍͜ͱΛܾΊΔ

Slide 21

Slide 21 text

21 ։ൃظؒ͸ϲ݄ ࠓճͷΰʔϧ͸8FC͖͔͚ͬͰొ࿥ɾߪೖ͢ΔϢʔβʔΛ૿΍͢͜ͱ ֦ு͠΍͍͢ߏ଄ʹͯ͠૊Έ௚͢ݕࡧྲྀೖ૿Ճ ద੾ͳϖʔδΛ૿΍͢ݕࡧྲྀೖ૿Ճ ֤ϖʔδద੾ͳϫʔυ͕දࣔ͞ΕΔΑ͏ʹ͢Δݕࡧྲྀೖ૿Ճ ཉ͍͠঎඼Λݟ͚ͭΔˠొ࿥ˠߪೖ͢Δεςοϓͷ୹ॖొ࿥ऀ਺૿Ճ ΍Δ͜ͱ ΍Βͳ͍͜ͱ ొ࿥ɾߪೖ·ͰͷεςοϓҎ֎ͷ6*ͷ࠷దԽ ࡉ෼ͷσΟςΟʔϧ

Slide 22

Slide 22 text

22 ϦχϡʔΞϧεέδϡʔϧ ݄ ݄ ݄ ݄ ೥ ొ࿥ߪೖػೳ։ൃ σβΠϯϚʔΫΞοϓ ։ൃʹ༩͑ΒΕͨظؒ͸໿ϲ݄ ෼ੳ ௥Ճاը ௐࠪ෼ੳ ߪೖػೳ  ϦϦʔε ௥Ճ։ൃ ௐࠪ෼ੳ ϖʔδมߋରԠ 4&0ରࡦ൛ ϦϦʔε σβΠϯϚʔΫΞοϓ ઌߦͯ͠ϦϦʔε ։ൃʹ࣌ؒΛཁ͢Δػೳ͸ฒߦͯ͠։ൃ ࡉ͔͘վળΛ܁Γฦ͢ ෼ੳ ௥Ճاը ϦϦ ʔε ϦϦ ʔε ௥Ճ։ൃ ݕࡧྲྀೖ ࠷దԽ ߪೖಋઢ ࠷దԽ ࠩ෼͸ਵ࣌औΓࠐΈ

Slide 23

Slide 23 text

23 ͭʹΘ͚ͯฒߦͯ͠ͷ։ൃ ·ͣ͸ઌߦͯ͠ྲྀೖ͕૿͑Δ܏޲͕͔ͭΊΔ͔Λখ͘͞ࢼ͢ ݕࡧྲྀೖ࠷దԽͷͨΊͷ։ൃ 4&0ରࡦʹ͍ͭͯ͸͜͏͢Ε͹࣮֬ʹޮՌ͕ݟࠐΊΔɺͱ͍͏΋ͷ͕͸͖ͬ Γ͍ͯ͠ͳ͍ͷͰɺখ͘͞ૣ͘ࢼͯ͠վળΛ܁Γฦ͢ํ਑Ͱܭը ݄ ݄ ݄ ݄ ෼ੳ ௥Ճاը ௥Ճ։ൃ ௐࠪ෼ੳ ϖʔδมߋରԠ 4&0ରࡦ൛ ϦϦʔε σβΠϯϚʔΫΞοϓ ઌߦͯ͠ϦϦʔε ࡉ͔͘վળΛ܁Γฦ͢ ෼ੳ ௥Ճاը ϦϦ ʔε ϦϦ ʔε ௥Ճ։ൃ ݕࡧྲྀೖ ࠷దԽ

Slide 24

Slide 24 text

24 ͭʹΘ͚ͯฒߦͯ͠ͷ։ൃ ྲྀೖΛ૿΍ͭͭ͠ɺߪೖͷମݧΛ࠷దԽ͍ͯ͘͠ ߪೖಋઢ࠷దԽͷͨΊͷ։ൃ 8FC্ͰߪೖΛ׬ྃͤ͞ΔͨΊʹ͸ɺձһొ࿥ػೳɺϩάΠϯػೳɺߪೖػೳ ͳͲ෇ਵ͢Δ͞·͟·ͳ։ൃ͕ඞཁͰɺ࠷୹Ͱ΋ϲ݄͸ඞཁ ݄ ݄ ݄ ݄ ొ࿥ߪೖػೳ։ൃ σβΠϯϚʔΫΞοϓ ௐࠪ෼ੳ ߪೖػೳ  ϦϦʔε ։ൃʹ࣌ؒΛཁ͢Δػೳ͸ฒߦͯ͠։ൃ ߪೖಋઢ ࠷దԽ

Slide 25

Slide 25 text

Slide 26

Slide 26 text

26 ݁Ռ͸ʁ ໨ඪΛେ͖͘ΫϦΞʂ ݄࣌఺Ͱ ΦʔΨχοΫ66਺͸ഒ ొ࿥Ϣʔβʔ਺͸ഒ ઌߦͯ͠ग़͍ͯͨ͠ࣄʹΑΓ݄࣌఺Ͱ͙͢ʹޮՌ͕֬ೝͰ͖ͨʂ ߪೖίϯόʔδϣϯ཰͕վળͨ͜͠ͱʹΑΓɺΞϓϦ͚ͩͰ׬݁͢Δ69ΑΓେ͖͘վળʂ

Slide 27

Slide 27 text

27 ໨ඪ͸ୡ੒͕ͨ͠ʜ ҰํͰ  σβΠφʔͱͯ͠͸  ·ͩ·ͩ΍Γ଍Γͳ͍՝୊͕࢒Δ

Slide 28

Slide 28 text

28 ҰํͰσβΠφʔͱͯ͠͸·ͩ·ͩղܾ͍ͯ͋͛ͨ͠՝୊΋ͨ͘͞Μ࢒Δ ຊ౰ʹ͜ͷφϏήʔγϣϯϝχϡʔͰྑ͍ͷ͔ʁͳͲࡉ͔͍෦෼· ͰϢʔβʔ໨ઢͰಥ͖٧ΊΔ͜ͱ͕Ͱ͖ͳ͔ͬͨ ϢʔβʔΠϯλϏϡʔͳͲΛॏͶͯಥ͖٧ΊΔ͜ͱͰ  ·ͩ·ͩΑ͘Ͱ͖ΔϙΠϯτ͸ͨ͘͞Μ͋ͬͨ ߪೖʹࢸΔܦ࿏Ҏ֎ͷମݧͷ࠷దԽ

Slide 29

Slide 29 text

29 ҰํͰσβΠφʔͱͯ͠͸·ͩ·ͩղܾ͍ͯ͋͛ͨ͠՝୊΋ͨ͘͞Μ࢒Δ ࡉ͔͍ύʔπͷσΟςΟʔϧʹͩ͜ΘΓ͖Δ͜ͱ͕Ͱ͖ͳ͔ͬͨ σβΠφʔͱͯ͠͸͜ΕҎ্ແ͍σβΠϯͰग़͍ͨ͠ؾ࣋ͪ͸͋Δ σΟςΟʔϧ΁ͷͩ͜ΘΓ

Slide 30

Slide 30 text

30 ໨ඪͱ޲͖߹͏ ࠓճͷ໨త͸ͳʹʁ

Slide 31

Slide 31 text

31 ໨ඪͱ޲͖߹͏ 8FC͖͔͚ͬͷϢʔβʔΛ૿΍͢ʂ ݕࡧྲྀೖͷ࠷େԽ ߪೖಈઢͷ࠷దԽ

Slide 32

Slide 32 text

32 ·ͩ·ͩ΍Γ͍ͨ͜ͱ͸͋ΕͲʜ ཧ૝͸͋ΕͲɺϦχϡʔΞϧ࣌ʹ  ࠷ॳ͔Β͢΂ͯΛ׬ᘳʹ΍Γ͖Δͷ͸  ࣌ؒతʹ΋ίετతʹ΋೉͍͠ɻ  ·ͣ͸ͦͷ࣌ʑͷ໨ඪʹ޲͔͔ͬͯͬ͠Γͱ੒ՌΛग़͢ɻ  ͖ͪΜͱͨ͠Ձ஋Λ࡞Γɺ  σʔλΛݟͳ͕ΒվળΛॏͶͯΑΓߴΈΛ໨ࢦ͢ʂ ·ͣ͸໨ඪʹର͔ͯͬ͠͠Γ݁ՌΛग़͢

Slide 33

Slide 33 text

33 ͜ͷޙ8FCʹ΋஫ྗ͢΂͖ͱ൑அ͞Εɺ  Ҿ͖ଓ͖։ൃ͕ܧଓ͍ͯ͠·͢ɻ  ݱࡏ͸Ҿ͖ଓ͖৽ͨͳϝϯόʔͰ  8FC൛ͷվྑ͕೔ʑਐΊΒΕ͍ͯ·͢ɻ ొ࿥ಋઢ΋ݟ௚͠Λߦ͍ɺ  ͞Βʹେ͖͘ొ࿥཰Λ৳͹͢͜ͱ͕Ͱ͖ΔΑ͏ʹͳΓ·ͨ͠ɻ ݁Ռ͕͍ͭͯ͘Ε͹·ͨνϟϨϯδͰ͖Δ

Slide 34

Slide 34 text

34 6*΍69ΛΑΓΑ͍ͯͨ͘͘͠Ίʹ͸༷ʑͳख๏͕͋Γ·͕͢ɺ  ࠷ॳ͔Β͢΂ͯΛ࢖͍ɺ͢΂ͯΛ׎͑Α͏ͱͤͣ ҰาҰา࣮֬ʹɺͦͷ࣌࠷దͳखஈ΍ख๏Λ൑அͯ͠  ͞ΒͳΔ੒௕Λ໨ࢦ͍͖͍ͯͨ͠ͱࢥ͍·͢ ΰʔϧʹ߹ΘͤͯͭͲ࠷దͳखஈΛબ΅͏ʂ