明星和楽に参加してきました!

9月8,9日と行われた明星和楽に
ボランティアスタッフとして参加してきました!

私は今回、主にネイルのワークショップのアシスタントをしていました☆

9月8,9日と行われた明星和楽に参加してきました!

明星和楽は今年が第2回だったのですが、
昨年は東京出張とかぶっていて参加できずだったので、

今年が初参加となりました。

いろいろとレポートが上がってきているので
そのあたりはレポートのプロの方にお任せするとして…。

私は個人的な感想などを。

土曜日、私はネイルのワークショップのお手伝いをさせていただいたのですが、

photo by shigeoka

その隣ではJS+CSSのワークショップが行われていて、

photo by shigeoka

そのまた向こうでは福岡のアイドルキュンキュンが熱唱しているという…

photo by shigeoka

で、かわいい歌ですねーとかいいながらネイルを塗るという…

photo by shigeoka

…近年まれに見るなんでもアリ!なイベントでしたw

公式サイトによると、【明星和楽とは「アジアのテクノロジーとクリエイティブに関わる人々が福岡に集まる」フェスティバルです。】とのことなんですが、

想像しやすいようにいうと…
デザフェス+IT系セミナー+クラブイベントのような感じ…………???

私はあんまりクラブ的なものは得意ではないので><
デザフェスっぽい部分+IT系セミナー部分での参加だったのですが
ライブペインティング見れるのがおもしろかったです☆

あまりそういう作業中の風景ってみられないので。

photo by shigeoka

普段一緒になることのない人たちがいろいろいて
いろんな世界を見た気がしました…!!!!

あと、コーヒーミーティングのブースがあってびっくりしました!

一人できた人もお友達作れたりしそうでいいですね☆

私も登録してます♪

事前に特設ページができてて、
そこでミーティングを成立させておいて
この場でコーヒーミーティングって感じだったみたいなのですが、
飛び入り歓迎にして、きた人をどんどん席に案内していって、
普段会えそうもない人と喋るとかも楽しいのかも?とか思ったりもしました☆

関係者のみなさま、参加者のみなさま、お疲れさまでした☆

P.S 写真撮るのを忘れたので誰かいい感じの写真下さい…w

写真をshigeokaさんよりお借りしました!ありがとうございました☆

デジハリ福岡校さんでのFireworks講座終了しました♪こんな感じでやりました!まとめ。

5回にわたってデジハリ福岡校さんで開催させていただいた
Fireworks講座が、先日無事に終了しました☆

毎週水曜日に週に1回、2時間で全5回の講座でした。

授業はこんな感じで開催させていただきました。

5回にわたってデジハリ福岡校さんで開催させていただいた
Fireworks講座が、先日無事に終了しました☆

毎週水曜日に週に1回、2時間で全5回の講座でした。

授業はこんな感じで開催させていただきました。

全5回の概要

第1回

まずはテキストは使わず、オリジナルの実習ファイルで
Fireworksの機能と特徴に慣れていただく回にしました。

  • 自動シェイプの使い方
  • パターンの使い方
  • テクスチャの使い方
  • ツイストアンドフェードの使い方

などなど。

とりあえずこういうことができるんだ、というのを
サンプルファイルでの実習をメインにひたすら2時間。

まずはFireworksはどういうことができて、
どういうことが得意なのかというのを知っていただくのが狙いです。

第2回

テキストPart2のポラロイド写真、およびそれを使ったバナー作成を行いました。

この部分はパターンやテクスチャの使い方、画像のマスクの方法といった
よく使う機能がすべて盛込まれたレッスンなのでこちらをチョイスしました。

ここまででFireworksでの基本的な操作に慣れていただく狙いです。

後半ではワイヤーフレームの作成方法をやっていきました。
スタイル機能を使って書体を統一する方法や、複数のボックスを1度に同じサイズにする方法、きれいな間隔で並べる方法など、知っているといないとでは作業時間に大きな差が出る機能を中心に解説しました。

第3回

第2回作成したワイヤーフレームをベースに
トップページカンプを作成していきました。

ここも、スタイル機能を使った便利なデータの作り方から
検索置換機能を使った文字の置き換え、
整列パネルを使ったオブジェクトの揃え方や
コーダーさんに依頼する時便利なデータの作り方など
ここでも知っていると知らないとでは大違いの小ワザをご紹介しながら制作していきました。

またアニメーションGIFの作り方についても実習しました。

第4回

出来上がったカンプの効率的な画像のスライスの方法、
そして複数ページの管理の方法についての授業を行いました。

Part3の内容を中心に、ページ機能、共有レイヤー機能、シンボル化をうまく活用して複数ページに渡るデータを上手く管理する方法について実習しました。

これらの機能の違いが以外とわかりにくかったりするのですが、
こういうときはこっち、という形で
違いと使いどころなどをしっかり解説させていただきました。

また、知っておくと便利なコーディングのときに役立つTipsについてもご紹介しました。

最終回

CS6から搭載された超便利なCSSプロパティパネルの使い方について学習しました。
やはりここがかなり好評でした。

もうこの機能がないとコーディングしたくない!ぐらい便利に使っているので
うまく伝わってうれしかったです^^

また、Fireworksを使い込んでいくうちに出てくるであろうつまずきやすいポイントを
事前に解説しました。

便利なエクステンションや素材配布サイトなどもこの回にご紹介。

リクエストにお応えして自動シェイプを使ったアイコンの作り方を実習しました。

授業で気をつけたこと

Fireworksのよいところと悪いところをしっかり説明

もちろんツールは必要にあわせて使い分けた方が
一番効率がよいので、

・こういったところはPhotoshopで
・ここはillustratorが間違いない

といった部分もしっかりとご紹介しつつ、

Fireworksを使って時短できるであろう部分をしっかりと説明させていただきました。

教科書を読めばわかることに時間をとりすぎない

教科書にはありがたいことに
拙著のFireworks CS5/4/3(速習デザイン)を使用させていただいたのですが、
本を読めばわかるようなことは極力省き、
本には書ききれなかったことや、
本でこのように説明した意図などをわかりやすくお伝えすることに努めました。

もうありったけのFireworks Tipsを出し尽くしたので
ぜひこれらの機能のなかで、実務に取り入れられるところから
活用していっていただけたらいいなと思っています。

ご参加頂いたみなさま、本当にありがとうございました!!!

…そして!

なんともありがたいことにご好評を頂き、
もう一度このFireworks講座をやらせていただけることになりました!!

10月31日から、毎週水曜日に全5回の内容です。

もしご興味のある方いらっしゃいましたら
どうぞよろしくお願いします^^

詳しくはこちらから↓

10月31日(水)より、デジタルハリウッド福岡校限定で「Fireworks講座」を開講します!

http://blog.dhw.co.jp/fukuoka_event/2012/09/webfireworksyuk-5dbc.html

深い階層にある静的ファイルとWordPressを共存させる方法

WordPressで静的ファイルとWordPressの処理の切り分けに困っていたのですが、twitterで解決策を教えていただきました!ブログに書いてもいいといっていただいたのでシェアします☆

WordPressを使っていても、
同一サーバー内に静的ファイルを置いてそれと共存させることができます。


たとえばこんな感じで静的ファイルを置けば、
http://wordpressをインストールしたURL/pamphlet/index.html
にアクセスすれば、WordPressを介することなくこのディレクトリ内のindex.htmlが表示されます。

この場合はよいのです。

問題なのは以下のような場合。

まずWordPress側のパーマリンク設定をデフォルト以外にしていて、
abcdeというスラッグのページを

http://wordpressをインストールしているURL/abcde/

というような感じでディレクトリにアクセスしているっぽいURLにしている場合で

pamphletという部分はWordPress側でページを表示させて、その下にあるpageというページ(まぎらわしいですね…)はhtmlをそのまま表示させたい。
ですが、こういう構造になっているとWordPressでpamphletというスラッグをつけてページを作っても、こちらの存在するディレクトリを優先して読みにいってしまうので、このディレクトリには表示できるものがなにもないため403エラーになってしまいます。

どうしても解決しきれなかったので、twitterでお助け願いを出してみました。

すると@Webnistさんと@jim0912さんからすばらしいアドバイスをいただくことができました!!

私の他にも同様のことができなくて困っていた方もいらっしゃったようなので、お二人に許可をいただいたので解決方法をシェアします。

それがこちら。

WordPressをインストールしているディレクトリ内にあるindex.phpを対象のディレクトリにコピーして、index.php内にあるwp-blog-header.phpへのパスをそのディレクトリからのパスに書き換える(@Webnistさん)

こうすることによって、上位のディレクトリでWordPressの実行ファイルを読み込むようになるので、WordPress側で用意したページが読み込まれるようになります!

手順はこう。

1)WordPressをインストールしているディレクトリにあるindex.phpを、WordPressを使用して表示させたいディレクトリ(今回はpamphletのディレクトリ)にコピー

2)コピーしたindex.phpを開き、require(‘wp-blog-header.php’);の一行のパスを書き換える

3)WordPress側でページを作成し、pamphletというスラッグを設定する

以上です!

私はこうしました。

WordPressがあるディレクトリより1階層下のディレクトリだったので

require(‘../wp-blog-header.php’);

としました。

WordPressをルートにおいているなら
require(‘/wp-blog-header.php’);
でもいいと思います。

注意点としては

WordPressに付随するファイルを書き換えておかないといけないのでアップデートの時index.phpに更新がかかっていないかチェックしてあげる必要がある

とかでしょうか。

でもルートのindex.phpの中身ががらっと変わることはないんじゃないかなーとは思うのでそこまで気にしなくていいかな?どうかな?

ほかにも、

静的ページは他のWPとは干渉しないディレクトリに置いて、.htaccessで、/a/b/index.html だったら、そっちにリライトする(@jim0912さん)

というのを教えていただきました。

WordPressに付随するものをコピーしたりいじったりしなくていい方法です。

注意点としては

リダイレクトするので静的ファイルのURLが変わってしまう
.htaccessを管理画面から書き換えたりするときに注意が必要

という点があります。

どうしても解決できなかったのでどちらの方法も本当に勉強になりました!
ありがとうございました!

こういう構造にならないようにサイト設計するのが一番なんでしょうが、リニューアル案件ですでにURLを告知しているので変えられないとかやむを得ない事情でなんとかしないといけない場合も多々あると思うので、同じことで困っていたみなさん、ぜひお試しくださいね☆

教えていただいた@Webnistさん、@jim0912さん、本当にありがとうございました!!

デジハリ福岡校さんでFireworks講座の講師をさせていただけることになりました!

デジハリ福岡校さんでFireworksの講座をさせていただけることになりましたのでお知らせさせてください!

このたび、デジハリ福岡校さんでFireworksの講座をさせていただけることになりました!

詳細はこちら↓

毎週水曜日、19:30-21:30の全5回の講座です。
7月25日スタートです!

サイトにはIllustratorまたはPhotoshopの使用経験がある方とありますが、
速習デザインFireworks CS5/4/3 の内容をベースに基本からしっかり進めていきますのでIllustratorやPhotoshop、Fireworksをすこしでもさわったことがあるかたなら大丈夫だと思います☆

もちろん本の内容だけではなくて、本には書ききれなかったTipsなどもいろいろご紹介できればなーと思っています。

折角頂いた機会ですので、参加してくださる方のお役に立てるよう、一生懸命頑張ります!!

もしご都合がつけばご参加頂けるとうれしいです^^

Fireworks CS6に自作のデータがプリインストールされました!

先日発売になったFireworks CS6、みなさんお使いになられましたか??

カラーパネルまわりが一新されたり、CSS3の書き出しが強化されたりとさらに使いやすくなったCS6なのですが、このCS6に自作のいろいろな素材がプリインストールされたのでうれしすぎてお知らせです!!!!!

先日発売になったFireworks CS6、みなさんお使いになられましたか??

カラーパネルまわりが一新されたり、
CSS3の書き出しが強化されたりとさらに使いやすくなったCS6なのですが、
この度、このCS6にデータの提供をさせていただきました。

Fireworks Interviewsというサイトでインタビューしていただいたことが
きっかけで声をかけていただき実現しました。

β版のときだけかなー?なんて思っていたのですが、
製品版にもしっかり入っていました。
(同僚のマシンでも確認したので間違いない…はず…)

Fireworks CS6を起動したら
自作の素材がプリインストールされていたときの感動といったら…;;

はじめはテクスチャとパターンだけかと思っていたのですが、
使っているうちにほかにもいろいろと入っていることに気がついたので
ご紹介させてください^^

共有ライブラリ

共有ライブラリにボタンの素材が入ってました。

これはまさにこのボタン達。

くぼんだような表現ができる14色のボタン&角丸長方形活用術【スタイルダウンロードつき】
http://fw.v-colors.com/colorful-button-style.html

スタイルファイル版はこちらからダウンロードできますのでこちらもぜひどうぞ^^

スタイル

スタイルにも2つ、自作のスタイルが入っていました。

こちらはパターンのスタイル。
クリックするだけでこんな感じに簡単に塗りつぶしパターンが作れます。

ビビッドカラーズ -0円の素材屋さん-
http://www.v-colors.com/sozai/background/check/check-06/

こちらでも配布していますので、そのままWeb素材としてもどうぞ^^

ストロークのスタイルも入っていました。

gumroadで販売したStroke 100 Packの一部でもあります。

もっといっぱい欲しい!というかたはよかったらこちらも…w

日本円も設定できる!Gumroadはじめました!
http://blog.v-colors.com/gumroad.html

テクスチャ、パターン

よく使う機能なので一番はじめに気がつきました。

最初見たとき、夢かと思いました。

「好きです」って公言しておくのはとても大事

というわけでうれしすぎてご紹介でした。

Firworks CS6を使っていらっしゃる方、
使いどころを選ぶ素材が多いですが…機会があれば使ってみていただけるとうれしいです^^

ここ数年、想像もしていなかったようなことが次々起こって
「私はこれが好き!」「これが得意!」
ということをオープンにして伝える大事さを身をもって学びました。

これもひとえにFireworksマニアをはじめとする
サイトを見てくださっている方々のおかげです。

本当にありがとうございます。

私は、Fireworksが大好きです!w

これからもがんばります♪

SaCSS WordPress SpecialでFireworksと個人サイト運営の話についてお話しさせていただきました♪

札幌で開催されたSaCSS WordPress SpecialでFireworksと個人サイト運営の話についてお話しさせていただきました!
ホントにホントにホントに楽しかった!!!

先日お伝えしたように、なんとなんと北海道でお話しする機会をいただき、札幌へ行ってきました!

プライベートでは3回目の北海道、2回目の札幌だったのですが、お仕事でいくのはもちろんはじめてでした。

飛行機からの眺め。きれいな空でした。

旧北海道庁!おしゃれ!

セミナー会場はこちら建物の中の会議室。とーってもきれいでした!!(photo by @jim912)

私はFireworksと個人サイト運営についてのお話をさせていただきました。

当日はデモ中にFireworksが落ちたり一瞬ひやりとする場面もありましたが…!
なんとか乗り切り、無事に終えることができました!

札幌のみなさんが優しい方ばかりで
アンケートを拝見させていただきながらほろりときてしまいました。

聞いていただき、本当にありがとうございました><。

当日のスライドです。

デモ中心だったのでこれだけでは情報が不足しているかと思いますが、
当日お配りしたプリントとあわせてご覧頂ければ幸いです。

実際にやってみてここがわかりにくかった、もうちょっと知りたいなどありましたらできる限りフォローできればと思いますのでご遠慮なくご連絡くださいね!

後半お話しさせていただいた個人サイト運営についてですが、
業務的なメリットだけでなく、
いろんなサイトを運営してきたことによっていろんなかたとお会いできたり、
こんな風に札幌の方達ともお会いすることができて、
はじめたころには想像もつかなかったような出来事がたくさんありました。

個人サイトでの経験は絶対に日々の制作業務のスピードアップにもつながりますので
ぜひやってみていただけるとうれしいです^^

今回お会いできたみなさんと絶対絶対またお会いしたいので、
また札幌に行けるよう、福岡で一生懸命お仕事&サイト運営しようと思います♪

いつかぜひ福岡にもお越し下さいね☆

この度は本当にありがとうございました!!

DTP Booster 036 は福岡で開催されるそうですよ♪

今日はDTP Booster 036が福岡で開催されるそうなので
福岡のみなさんにお知らせです☆

DTP Booster 036が福岡で開催されると教えていただいたので
福岡のみなさんにお知らせです☆

http://www.dtp-booster.com/vol36/

日時は、2012年6月15日(金)19:00-21:00

場所はデジタルハリウッド福岡校 セミナールーム とのこと。

内容は以下のような感じ。

Web制作でも重要なIllustratorのアレコレ

『10倍ラクするIllustrator仕事術』最新バージョンのIllustrator CS6は、バージョン10から数えても7世代目、バージョン8.0からは年数にして13年の開きがあります。当然ながら、たくさんの機能強化されているため、CS/CS2/CS3/CS4/CS5/CS5.5をお使いの方でも、古いバージョンの使い方のままで作業されている方も少なくないようです。
CS以降のIllustratorでは、直しに強いデータづくりを行うための「ライブ」な機能を中心に、さりげなく、ワークフローが変わる機能強化を遂げています。

たとえば「文字ツメ」。IllustratorにはCS以降、自動カーニング機能が強化されていますが、いくつかの実装方法があり、どの機能をどの場面で使っていけばよいのか、迷っている方は少なくないでしょう。Illustratorを使った日々の作業の中で使いこなすべき、最近のIllustratorでのデータメーキングの流儀、過去のIllustratorとの相違点など、現場視点での使いこなしについて、デモを中心にお話しします。

Illustrator CS6のポイントについても解説します。

「ひむかフォント」の作りかた

MdNの書籍「DESIGN FONT」に収録されていたフォント「ひむかフォント」の制作について、エピソードや制作方法などをインタビュー形式で伺います。

Webやる時はFireworks一択な私ですが、
IllustratorもPhotoshopもどっちもガツガツ使っています。

今後デザインの幅を広げて行くためにもIllustratorの使いこなしはしっかりと押さえておきたいところ!!

10倍ラクするIllustrator仕事術も熟読したので準備万端です!!

もうひとつのセッション、フォントの作り方もかなり興味津々!!!
今回のセミナーがとっても楽しみです♪

こういう系のセミナーはあまり福岡では開催されないので
うれしいですよねー♪

DTP Booster 036 はかた
http://www.dtp-booster.com/vol36/

おまけ:デジハリは博多ではなく天神にあるんやで…!!というのは、あえてつっこまないようにしようと思いますw

第1回Fukuoka.phpが開催されました!(スライド公開中)

2012年5月23日、第1回 Fukuoka.phpが開催されました!

LTもしてきちゃいました!

第1回 Fukuoka.phpが開催!

2012年5月23日、第1回 Fukuoka.phpが開催されました!


↑写真はプリンさんのLT。安定の面白さでしたw

昔はPHP in Fukuokaっていうのがあったんだよ!

福岡でPHPの勉強会といえば、5年前にPHP in Fukuokaというのがあって、わたしもその勉強会に何度も参加したおかげでPHPが使えるようになりました。

そう!私のPHPerの原点といっても過言ではない…!

が、そのPHP in Fukuokaも開催されなくなって久しく、長らく福岡のPHPコミュニティーは活動休止状態だったわけです。
そんな中、Fukuoka.phpが発足!

発足の経緯はこちらのようです→「Fukuoka.php」の立ち上げから開催直前までの流れ

なぜかLTしてきた

で、なぜこんなぺーぺーの私が参加してさらにLTまでしてきたかというと…

実は主催者の@akase244さんが以前プログラマとして勤めていた会社で先輩だった方で。

「23日、LTやって!」と。

…せ、先輩のご依頼は断れないっす!

ということで、恐れ多くもLTさせていただくことになりました。

PHPで画像処理のいろいろとか話してみました。

折角なのでデザイナーっぽいものを…と思いまして、
「PHPで画像処理のいろいろ」というタイトルでLTさせていただきました。

LTだったのに結構な時間喋ってた気がする…ごめんなさい><。

昨日のスライドをUPしてます。
一応ちょっと付け足したりしたのですがわかりにくいですね…。
すいません。

Ustもしてたみたいなのですが、見たら死にたくなるのでURLはのせません><

スライドや関連サイトなど

私のセッションの中に出てきたサイトとか

このへんとかもあわせて見ていただけるといいかなーと思います。
PHP関数講座:イメージ関数 — そふぃのphp入門
http://nyx.pu1.net/function/image/

PHOTO STOCKERに似た色画像検索を実装してみました!
http://blog.v-colors.com/photo-stocker-color-search.html

あと、実際にこれらを使っているサイトです。

PHPで画像のリサイズ&PHPでカレンダーを実装してます

壁紙カレンダー
http://wallpaper.v-colors.com/

WallPaper Collection
http://machiuke.v-colors.com/

PHPで似た色画像検索を実装しています

PHOTO STOCKER
http://photo.v-colors.com/

PHPで画像の色を取得してよく使われている色の判定を実装しています。

Web Site Colors Picker
http://pick.v-colors.com/

Fukuoka.php関係のまとめ

Facebook

https://www.facebook.com/groups/355557634510818/

twitter

@fukuokaphp

私以外の方の第1回勉強会のスライドなど

SPLで遊んでみる/@cakephper
http://www.slideshare.net/ichikaway/spl-fukuokaphp1

PHPのテスト手法とかのおさらい/@akase244
http://prezi.com/-xxnituivznw/fukuokaphp-vol1/

baserCMSにみられるCakePHPノウハウ蓄積法/@ryuring
http://www.slideshare.net/ryuring/basercmscakephp

PHP関数探訪/@debility
http://zenpre.net/p/_e36R

REPORT: Fukuoka.php Vol.1 #fukuokaphp

REPORT: Fukuoka.php Vol.1 #fukuokaphp


初心者の人もそうでない人も、福岡でちょっとでもPHPを見たことある/さわったことある人は参加したらいいとおもう!

こういう勉強会って、「自分には難しそう…」とか思ってしまってなんとなく敷居が高かったりするかもしれないのですが、私はさっぱりわからないものこそ参加した方がいいんじゃないかなーと思っています。

だって「わからないときに誰に相談したらいいのか」わかるようになるから!!!!

これって結構大事だと思うのです。

私も実際何度もいろんな人に助けてもらいました。

実際私も5年前は呪文にしか聞こえませんでした。
今も呪文に聞こえること多々ですが…w

こんなの理解できるかなー…と思う人も、まずは一度足を運んでみてはいかがでしょうか?^^

私もまた参加したいです!
新しい呪文を覚える!w