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
CSS Nite in Osaka, vol.48
Search
rie05
December 15, 2018
Design
1
870
CSS Nite in Osaka, vol.48
CSS Nite in Osaka, vol.48で発表したスライドです
rie05
December 15, 2018
Tweet
Share
More Decks by rie05
See All by rie05
CSS Nite in Osaka, vol.53 Girls Nite vol.2 LT飲食店×Web制作
rie05
3
130
これからデザイナーとして生き残るために必要なスキルと戦略
rie05
0
300
これからのデザイナーに必要なスキルと考え方
rie05
3
5.1k
Other Decks in Design
See All in Design
保育AIプロダクトの UXデザインで考えてきたこと / hoiku-ai-ux-design
hiro93n
0
180
プロダクトリニューアルと同時に進める初めてのデザインシステム
techtekt
PRO
0
140
Spectrum Tokyo_ デザイナーが事業責任者になってみた
shin_2
0
160
組織はみんなでつくる。デザイナーが仕掛ける急拡大する組織のカルチャーづくり
mkasumi
0
550
チームで事業価値を生み出す、プロアクティブなデザイナーになるための道のり/ Designship2025_Naya
root_recruit
PRO
0
220
大きな変化の中で、わたしが向き合ったこと #もがく中堅デザイナー
bengo4com
1
1.3k
AI時代に、僕たちデザイナーはどう歩むか
kazuhirokimura
0
410
A Platform Connecting Brand Philosophy and Assets: "LY Corporation Design Hub"
lycorptech_jp
PRO
0
450
Building Experiences: Design Systems, User Experience, and Full Site Editing
marktimemedia
0
270
ユーザー体験は細部に宿る -ウィジェットQAの挑戦と気づき- / UX is in the details: Challenges and Learnings from Widget QA
bitkey
PRO
0
110
BXデザイン組織が挑んだスクラム 〜ブランドを育み、デザイナーを解放する変革の物語〜(Scrum Fest Mikawa 2025)
tadashiinoue
0
550
組織で取り組むアクセシビリティのはじめ方
masakiohsumi
0
190
Featured
See All Featured
Reflections from 52 weeks, 52 projects
jeffersonlam
353
21k
Building Adaptive Systems
keathley
44
2.8k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
35
3.2k
Practical Orchestrator
shlominoach
190
11k
4 Signs Your Business is Dying
shpigford
185
22k
Rebuilding a faster, lazier Slack
samanthasiow
84
9.2k
GraphQLとの向き合い方2022年版
quramy
49
14k
The Pragmatic Product Professional
lauravandoore
36
7k
Measuring & Analyzing Core Web Vitals
bluesmoon
9
640
Intergalactic Javascript Robots from Outer Space
tanoku
272
27k
No one is an island. Learnings from fostering a developers community.
thoeni
21
3.5k
Building a Modern Day E-commerce SEO Strategy
aleyda
44
7.8k
Transcript
σβΠφʔͷ ੍࡞ݱ Five Dimension Graphics ޱཧܙ
ޱɹཧܙ Seguchi Rie 1983େࡕੜ·Εେࡕҭͪɻ 5DG-Five Dimension Graphics-දɺσδλϧϋϦουେࡕߍߨࢣɻ 7੍ؒ࡞ձࣾͳͲͰΣϒσβΠφʔɺσΟϨΫλʔΛܦͯ2010ʹಠཱɻ ΣϒαΠτ੍࡞ΞϓϦUIσβΠϯͳͲΛख͕͚Δɻঁੑ͚σβΠϯ͕ಘҙɻ ִिՐ༵ͷUstream൪ʮrie'sCafebarʯύʔιφϦςΟʔͱͯ͠์ૹதɻ
ஶॻʰਓΛऒ͖͚ͭΔඒ͍͠ΣϒαΠτͷ࡞ΓํʱʢSBΫϦΤΠςΟϒʣɻ
ຊͷηογϣϯʹ͍ͭͯ ! εϥΠυࢿྉͷͪ΄Ͳެ։͞Ε·͢ ϑΥϩʔΞοϓϝʔϧͳͲͰ͓Βͤ͠·͢ ! ࣸਅࡱӨOKͰ͢ ϑϦʔૉࡐͰ͢ ! SNS࣮گܴͰ͢ ϋογϡλά
#cssnite
͜Μͳํ͚͓ͯ͠·͢ ! WebΛࣄʹ͍ͯ͠ΔσβΠφʔ ! WebσβΠφʔΛࢦ͍ͯ͠Δํ ! σβΠφʔͷকདྷʹෆ҆ͷ͋Δํ
ΞδΣϯμ σβΠϯʹೖΔલʹ σβΠϯ੍࡞ݱ ศརαΠτͱπʔϧ 01. 02. 03.
σβΠϯʹೖΔલʹ 01 Preparation before Design
WebσβΠφʔͷ͠͝ͱ༰ͱ ※ ৫νʔϜʹΑΓWebσΟϨΫλʔίʔμʔͳͲۀ੍Ͱׂ͕͔Ε͍ͯΔ͜ͱଟ͋͘Γ·͢ ใઃܭ ϏδϡΞϧ ίʔσΟϯά CMSߏங
ΫϥΠΞϯτʹώΞϦϯά͠ɺ ϖʔδߏϨΠΞτΛߟ͑Δ ใઃܭ 3W1Hͷ๏ଇ Who ୭ʹ What ԿΛ Why ͳͥ
How ͲͷΑ͏ʹ ϢʔβʔϑΝʔετΛΫϥΠΞϯτ㱻ΫϦΤΠλʔͰڞ༗
ώΞϦϯάͷํ๏ ΫϥΠΞϯτͷ ITϦςϥγʔʹΑͬͯ࠷దղ͕ҧ͏
ΫϥΠΞϯτλΠϓ ੍࡞͕ࣝ͋Δํ <ཧళɺΫϥΠΞϯτҎ֎ͳͲ> A B C WebΛগ͍ͬͯ͠Δํ <WordPressࢦఆͯ͘͠ΔͳͲ> WebΛ΄΅Βͳ͍ํ <εϚϗѻ͑ͳ͍͘Β͍>
ΫϥΠΞϯτλΠϓ ੍࡞͕ࣝ͋Δํ <ཧళɺΫϥΠΞϯτҎ֎ͳͲ> A ɾαΠτϚοϓϫΠϠʔ͕طʹ༻ҙ͞Ε͍ͯΔ͜ͱ͕ଟ͍ ɾͲ͜·Ͱ֬ఆͳͷ͔Ͳ͜ΛఏҊ͖͔͢ߟ͑Δ ɾઐ༻ޠ͋ΔఔOK ɾͲΜͰΜฦ͕͠ଟ͍ͷͰখ֬͘͞ೝ͠ͳ͕ΒਐΉ
ΫϥΠΞϯτλΠϓ WebΛগ͍ͬͯ͠Δํ <WordPressࢦఆͯ͘͠ΔͳͲ> B ɾͳͥWebΛ࡞Δͷ͔ɺͲ͏ͳΓ͍ͨͷ͔Λڞ༗͢Δ ɾiPad ProͱPencilͰͦͷͰεέον͠ͳ͕ΒܾΊΔ ɾXDͰαΠτϚοϓϫΠϠʔΛ࡞ΓఏҊ͢Δ ɾWordPressਪ͠ͳਓͳͥਪ͢ͷ͔ཧ༝Λฉ͘
ΫϥΠΞϯτλΠϓ WebΛ΄΅Βͳ͍ํ <εϚϗѻ͑ͳ͍͘Β͍> C ɾ·ͣΛฉ͘ ɾεέονϒοΫͱϖϯΛͬͯͦͷͰॻ͍͍ͯ͘ ɾେମͷϨΠΞτΛܾΊͨΒσβΠϯʹೖΔ(ݟͳ͍ͱ͔Βͳ͍ରࡦ) ɾϨεϙϯγϒ͕Ͳ͏ͱ͔ΑΓPC͜ΕɺSP͜ΕɺͰݟͤΔ
XDΛͬͨϫΠϠʔϑϨʔϜ DEMO தԝձܭηϛφʔϧʔϜ
σβΠϯ੍࡞ݱ 02 Design production site
ใઃܭʹج͖ͮɺ ػೳత͔ͭతୡͷͨΊͷσβΠϯΛ࡞͢Δ ϏδϡΞϧ ҰຕֆΛ࡞Γࠐ·ͳ͍ ࡞Γࠐ·ΕͨҰຕͷσβΠϯΧϯϓΑΓ εϐʔυײͷ͋ΔϓϩτλΠϓ͕تΕΔ
σβΠϯͳʹ͔͍ͭ·͔͢
Photoshop͕͖ὑ
PhotoshopΛͬͨσβΠϯ DEMO தԝձܭηϛφʔϧʔϜ
σβΠφʔݟͤํͷϓϩ ෳࡶͳͷΛγϯϓϧʹ·ͱΊ Δ ͍͜͠ͱΛ؆୯ͦ͏ʹݟͤΔ
ΦϖϨʔλʔʹͳΒͳ͍͜ͱ σβΠφʔ͔ͩΒͰ͖ΔఏҊΛΓࠐΉ
߈ΞτϓοτΛڧΈʹ͢Δ ఱ࠽తͳσβΠϯྗ͕ͳͯ͘ ߈୭ʹͰͰ͖Δ
ศརαΠτͱπʔϧ 03 Useful sites and Tools
Photoshop ΤΫεςϯγϣϯ ※ҙ※ ҎલΤΫεςϯγϣϯϚωʔδϟʔ͔ΒΠϯετʔϧͰ͖·͕ͨ͠ ࠷৽൛(CC 2019)Ͱ͖·ͤΜɻݸผͰΠϯετʔϧ͢Δඞཁ͋Γ Adobe Layer Namer https://www.adobeexchange.com/creativecloud.details.1680.html
Adobeެࣜɻը૾Ξηοτػೳͱ߹Θͤͯരʹը૾ΛΓग़͢
Photoshop ΤΫεςϯγϣϯ CRAFT https://www.invisionapp.com/craft ը૾͋ͯͨΓϦϐʔτάϦου Έ͍ͨͳ͜ͱ͕Ͱ͖ͨΓ
ࣸਅૉࡐͱΠϥετૉࡐ ࣸਅAC https://www.photo-ac.com/ ΠϥετAC https://www.ac-illust.com/
σβΠϯࢀߟ muuuuu.org http://muuuuu.org/ RWDJP http://responsive-jp.com/
͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ Thank you !
None