強・用・美から考えるテーマデザインのヒント_前編

by isaikaori

Slide 1

Slide 1 text

強・用・美から考えるテーマデザインのヒント Mie WordPress Meetup #3

Slide 2

Slide 2 text

有限会社アップルップル Webデザイナー 2018/04∼ 井斉花織人生初三重！自己紹介

Slide 3

Slide 3 text

この1年でやったこと LP制作受託サイト制作自社イベントの宣伝美術自社プロダクトの公式テーマ作成

Slide 4

Slide 4 text

コミュニティ活動 Adobe XD ユーザーグループ名古屋 Design Hack Nagoya

Slide 5

Slide 5 text

「強・用・美」知ってますか？

Slide 6

Slide 6 text

古代ローマ時代の城郭の設計者ヴィトルヴィウスが『建築十書』で述べた建築の三大要素強用美

Slide 7

Slide 7 text

強：構造・耐震性・火災時の安全性・劣化の軽減

Slide 8

Slide 8 text

用：機能・温熱環境・高齢者への配慮・家事動線

Slide 9

Slide 9 text

美：意匠・プロポーション・デザイン・芸術性

Slide 10

Slide 10 text

強がなければ、用はない強と用がなければ、美はないしかし美がなければ、建築ではない美用強 by ヴィトルヴィウス “ “ “ “ “ “

Slide 11

Slide 11 text

なぜ建築？

Slide 12

Slide 12 text

    学生の頃の専攻：建築社会人の今：Web業界

Slide 13

Slide 13 text

    学生の頃の専攻：建築社会人の今：Web業界似てるなぁ⋯

Slide 14

Slide 14 text

「強・用・美」 Webサイトに置き換えると

Slide 15

Slide 15 text

強：構造・サーバー・セキュリティ・マークアップ

Slide 16

Slide 16 text

用：機能・ユーザビリティ・UI/UX ・アクセシビリティ

Slide 17

Slide 17 text

美：意匠・デザイン・スタイリング

Slide 18

Slide 18 text

デザイン/スタイリングユーザビリティ/UI/UX/アクセシビリティサーバー/セキュリティ/マークアップ美用強このヒエラルキーも成り立ちそう

Slide 19

Slide 19 text

本日お話しするのが強・用・美テーマデザイン落とし込んだ話

Slide 20

Slide 20 text

テーマデザインプロジェクトの概要

Slide 21

Slide 21 text

自社で開発しているプロダクト a‑blog cmsの公式テーマ新テーマではなくリニューアル：インストールした時に入る：blog2018→blog2019

Slide 22

Slide 22 text

blog2018 Before

Slide 23

Slide 23 text

blog2019 after

Slide 24

Slide 24 text

1 2 3 4 制作フロー

Slide 25

Slide 25 text

1 2 3 4 制作フロー

Slide 26

Slide 26 text

1.昨年テーマの見直し使っていて不便に感じた点トレンドとのギャップ初期搭載で望む機能

Slide 27

Slide 27 text

1.昨年テーマの見直し著者紹介欲しい SPの最適化ヘッダー古い？全体幅微妙関連記事欲しい記事一覧古い？ ⋯

Slide 28

Slide 28 text

1 2 3 4 制作フロー

Slide 29

Slide 29 text

1 2 3 4 制作フロー

Slide 30

Slide 30 text

2.方向性の確立受注サイトの場合   受注側発注側ヒアリング

Slide 31

Slide 31 text

2.方向性の確立テーマ作成の場合   制作側ユーザー見えない

Slide 32

Slide 32 text

2.方向性の確立配布テーマなら   制作側ユーザー

Slide 33

Slide 33 text

2.方向性の確立でも公式テーマは⋯  メディアサイト  日常ブログ  技術ブログ  アフィリエイトみんなblog2019をカスタマイズする

Slide 34

Slide 34 text

そこで

Slide 35

Slide 35 text

ターゲットを絞り混まずに強・用・美テーマデザイン落とし込んでみる

Slide 36

Slide 36 text

公式テーマの特徴  メディアサイト  日常ブログ  技術ブログ  アフィリエイトみんなblog2019をカスタマイズする

Slide 37

Slide 37 text

美用強それぞれの性質は？

Slide 38

Slide 38 text

美用強高低それぞれの性質は？専門性

Slide 39

Slide 39 text

美用強高低カスタマイズ性易難それぞれの性質は？専門性

Slide 40

Slide 40 text

となると

Slide 41

Slide 41 text

は作り込み強用美は柔軟に扱いやすくは誰にでも受け入れられる

Slide 42

Slide 42 text

そう、まるで

Slide 43

Slide 43 text

無印良品の収納ケースそう、まるでのような

Slide 44

Slide 44 text

方向性無印良品で売ってそうなテーマ組み合わせ自由自在！クセのないシンプルな形！

Slide 45

Slide 45 text

続きは後編へ