有限会社アップルップル 山本 一道

を活用した 新しいWeb制作の ワークフロー

vol.56

山本 一道 -> @kazumich

1969年生まれ (45歳)

高校2年と中学2年と妻の4人家族

有限会社アップルップルの代表（私を含め10人のWeb制作会社）

2014年の　　　　 　　　全国ツアー

今日ご紹介する事

参加特典の紹介

「a-blog cms」の基本を紹介

アップルップルのWeb制作のワークフローの紹介

a-blog cms 2.1 新機能の紹介

今日はどんな人が 参加してるの？

職種

デザイナー

マークアップ

プログラマ

ディレクタ その他

その他 50%

プログラマ 19%

ディレクター 6%

マークアップ 19%

デザイナー 6%

職種

札幌

HTML・CSS

得意できる苦手無理

苦手 18%

できる 65%

得意 18%

HTMLCSS

札幌

PHP

得意できる苦手無理

無理 24%

苦手 53%

できる 24%

PHP札幌

3つの特徴

マークアップエンジニアのための国産CMS

phpの知識が無くても カスタマイズ可能

phpの知識が無くても カスタマイズ可能

phpの知識が無くても カスタマイズ可能

top.html

index.html

entry.html

用意された スニペットやモジュール の組み合わせでCMSを カスタマイズしていきます。

WYSIWYGを利用しない 記事投稿フォーム

WYSIWYGを利用しない 記事投稿フォーム

WYSIWYGを利用しない 記事投稿フォーム

WYSIWYGを利用しない 記事投稿フォーム

Demo

自由にデザインできる カスタムフィールド

自由にデザインできる カスタムフィールド

自由にデザインできる カスタムフィールド

自由にデザインできる カスタムフィールド

Demo

phpの知識が無くても カスタマイズ可能

WYSIWYGを利用しない 記事投稿フォーム

自由にデザインできる カスタムフィールド

の3つの特徴

Web制作ワークフローの紹介

2つのWebサイト制作方法

その前に

2つのWebサイト制作方法

部分的にCMS化全体をCMS化

この部分をCMSで更新可能に

どれくらいで出来る？

Demo

2つのWebサイト制作方法

部分的にCMS化全体をCMS化

今のWeb制作のワークフロー

設計 デザイン マークアップ CMS実装 登録

今のWeb制作のワークフロー

直列で順に作業するので時間がかかる

管理画面にアクセスできるのは随分後の方

…

Designing in the browser

Designing in the browser

Photoshop等でカンプを作らずにHTMLとCSSでコーディングして 完成形に近づけていく手法

私の出番は無いの？

アップルップルのやり方とは違うかな。

アップルップルのワークフロー

設計

デザイン マークアップ

CMS実装 登録

アップルップルのワークフロー

CMSプロトタイピング

CMSプロトタイピング

CMSの実装を先に行い、クライアントと早いタイミングから完成時の管理画面や公開側のページ情報を共有する開発手法

開発に専念してて� � 困った時だけお手伝い

設計

デザイン マークアップ

CMS実装 登録

アップルップルのワークフロー

https://itunes.apple.com/jp/app/tree/id451104825?mt=12

設計

デザイン マークアップ

CMS実装 登録

アップルップルのワークフロー

デザインとCMS実装 の並行作業

制作時間の短縮

設計

デザイン マークアップ

CMS実装 登録

アップルップルのワークフロー

CMSプロトタイプを見ながら デザインができる

用意するカンプに漏れがなく 配置する要素も確実に分かる

設計

デザイン マークアップ

CMS実装 登録

アップルップルのワークフロー

早いタイミングでの データ登録が可能

クライアントさん自身に 登録してもらう事も可能

設計

デザイン マークアップ

CMS実装 登録

アップルップルのワークフロー

ソーシャルログイン機能

並列承認機能

復活！カート機能

カスタムユニット

メディアユニット

まとめ

CMSプロトタイピング

HTML+CSSだけで カスタマイズ可能

できそうな気がしませんか？

ありがとうございました！

まずは一度使ってみて下さい