appcte

アプリ開発のネタのタネblog

面白アプリ情報や、アプリ開発ノウハウなどをお届けします!

13 9月

行ってきました「IGAS2015」!

みなさま

お疲れ様です。
大澤です。

台風や秋雨前線の影響で連日の大雨!
甚大な被害が出てしまったところもありますね……。
早い復旧を祈るとともに被害に遭われた方々には心よりお悔やみ申し上げます。

東京ビックサイト国際展示場にて「IGAS2015」http://www.igas-tokyo.jp/)が開催されております。
期間は9月11日(金)~16日(水)、
私は12日(土)に行ってきました。
01_IGAS2015案内02_受付
IGAS」とは「International Graphic Arts Show」の略で、「国際総合印刷機材展」と訳されています。
世界4大印刷機材展と呼ばれる、drupa(ドルッパ(ドイツ))、PRINT(プリント(アメリカ))、IPEX(アイペックス(イギリス))、そして今回のIGAS(アイガス(日本))。
3年周期で開催される展示会です。

「印刷機材展」というように各出店社様、印刷機や製本機、断裁機などを展示されており、実際に巨大な印刷機を稼働するデモには迫力を感じました!
プリプレスという職種上、普段お目にかかれない機材類ばかりなので大変勉強になりました。

今回も特に印象に残ったものをクローズアップしたいと思います。

「機材展」といいつつも、大きな機材とは異なった内容になりますが、
目を引いたもので木版画を展示しているブースがありました。

「東京伝統木版画工芸協同組合」様
http://edohanga.jp/
11_木版画09
▲「東京伝統木版画工芸協同組合」様の展示ブース。

09_木版画07
▲展示されていたのは、工程解説図、木版本体(墨版と色版)、馬連(刷る紙に加圧するもの)、 刷り上がり後の版画。

10_木版画08
▲馬連(バレン)。
主材料は竹。
職人用の馬連は竹を紐状にし、渦巻きにして、さらに竹で包むという手の込んだ造りになっています。
微妙な圧力調整をするのにかかせない構造だったのでしょうね。
左上の黒いものは馬の尻尾で作られたブラシです。
版面で絵の具を混ぜるのに使用したそうです。

12_木版画10
▲刷る工程が分かりやすく解説されていました。
一色づつ刷っていく工程で、いわゆる多色刷りです。
現在ではハイファイ印刷やヘキサクローム印刷といった、6、7色の多色刷りですが、上図の木版画の色数はなんと20色!
多いものでは90色の版画もあったということです。
その色数分、刷ったということです。
大変でしたでしょうね……。
※色の数分、版を作るということではなく、同じ版上で絵の具を変えて刷るということです。

04_木版画0203_木版画01
▲色刷り用の版(左)と墨刷り用の版(右)。
墨は主に画の輪郭線を表現します。

05_木版画0306_木版画04
▲版の左側と左下に紙を固定する溝が彫られています。
現在でいう「トンボ」に該当します。

07_木版画0508_木版画06
▲こちらは墨版。
同じく「トンボ」の溝が彫られています。
※上記の写真撮影、ブログ掲載の許可はいただいております。
理事長の高橋様 ありがとうございました。

続いてこちらも「機材」ではありませんが、
「Japan Color認証制度」
http://japancolor.jp/about/about.html
13_JapanColor
日本のオフセット枚葉印刷の標準である「Japan Color」をベースに認証を行うという制度。
「標準印刷認証」、「マッチング認証」、「プルーフ運用認証」、「プルーフ機器認証」といった、
印刷会社、デザイン会社、プルーフ機器メーカー等、それぞれの立ち位置ごとに構成されています。
※詳しくはこちら http://japancolor.jp/about/attestation.html
現在取り組み中のDTPエキスパート更新試験にも関連した内容でしたので大変参考になりました。
※写真撮影、ブログ掲載の許可をいただきました。
ありがとうございました。

他にも色々と話を伺いましたが、今回はこのくらいにしておきたいと思います。
上でも書きましたが、期間は9月16日(水)まで。
お時間があるようでしたら行ってみてはいかがでしょうか?
最後まで読んで下さり、ありがとうございましたm( _ _ )m
15 8月

ちょっとWEBのお話…。~Emmet編~

みなさま

お疲れ様です。
大澤です。

前回ブログを書いた時は梅雨だったのに、夏、真っ最中!
「暑いっ! 暑いっ! 暑いっ!」
毎日毎日言い疲れました…。w
早く冬にならないかなぁ…。ww

さて、本題です。
JAGAT主催 DTP・クロスメディア、両エキスパート認証試験にもHTML5やCSS3、Flash、電子書籍など、ペーパーメディア以外の事柄も多く扱われております。
これらを学ぶにあたり、特に、HTML5の技術に興味を抱きました。
昨年の10月に正式勧告されたということもあり、
「やるなら、今でしょ!」
ということで、突っ込んだ勉強を始めてみようと思った次第です。

下図をご覧下さい。
01_SublimeText02_Brackets03_Atom

左「Sublime Text3
シェアウェアです。値段は為替の影響で変動しますが、この記事を書いている8月15日は、$70でした。
中央「Brackets
Adobeが公開している無料のテキストエディタです。
右「Atom
これも無料のテキストエディタです。
※全て英語版です。
これらは、聞いた話ですとWEB業界では「3大エディタ」と呼ばれているそうです。
Windowsの「メモ帳」やMacの「テキストエディット」でもHTMLは書けますが、
機能的に優れているということで重宝されているそうです。

タイトルにある「Emmet」ですが、これはタグの入力を補助してくれるもので、上記のエディタ類に別途追加する必要があります。
今回は「Sublime Text3」で話を進めようと思います。

手順として、まず「Sublime Text3」を下記サイトよりインストールします。
http://www.sublimetext.com/3

次に「Package Control」というものをインストールします。
これは「Sublime Text3」に色々な機能を追加するために必要なものです。

手順は以下です。
まずは https://packagecontrol.io/installation#st3 にアクセスし「SUBLIME TEXT3」のタブに表記されているコードをコピーします。
04_PackageControl
▲赤く囲んだ部分をコピーします。

次に下図のように「Sublime Text3」のメニューから View -> Show Console と選択します。
05_ShowConsole

06_paste
▲Consoleバーが表示されるので、赤囲みの箇所に先ほどコピーしたコードをペーストします。
enterキーを押下するとインストールが開始します。
インストール完了後、Sublime Text3を再起動すると「Package Control」が使用できるようになります。

次に「Emmet」をインストールします。
Tools -> Command Palette を選択します。
07_CommandPallet

08_emmetインストール01
▲先ほどインストールした「Package Control」画面が表示されるので「Install Package」を選択します。

09_emmetインストール02
▲続けて入力画面が表示されるので「emmet」と入力し「Emmet」を選択します。
インストールが開始されます。
最後に「Package Emmet successfully installed」と表示されれば完了です。

ようやく準備が整いました。 それでは「Sublime Text3」で新規ドキュメントを作成し色々と試してみましょう。

File -> New File と新規ドキュメントを作成します。
ドキュメントウィンドウの右下のテキストの種類が「HTML」になっていることを確認します。
10_新規ドキュメント

ここをプルダウンすると、テキストの種類を確認することができます。
11_テキストの種類

とりあえず、「html:5」と入力し「tab」キーを押下します。
※returnキーやenterキーではありません。
12_html入力

すると、基本的なタグを自動入力してくれます。
これは便利!
13_tab押下後
▲lang属性の値を「ja」にしたりもできますが、今回は割愛します。

下図のような入力では……。
ol>li_01

このようになり…。
ol>li_02

下図のような入力では……。
ol>li*3_01

ol>li*3_02
このようになります。

なんとなくお分かりいただけたと思いますが、「>」の下に子要素を作成していくということです。

では、少し複雑にしてみましょう。
「番号付きリストのclass属性に値「test」が連番で5つ、それぞれに「テスト01」~「テスト05」を表示をさせるとしましょう。
14_emmet入力01
▲その際は「html:5>ol>li[class="test$"]{"テスト0$}*5」と入力します。
「[ ]」内に属性と値、連番は「$」を表示内容は「{ }」内に入力します。
最後の「*5」は個数を表します。

15_emmet入力02
▲タブを押下すると、見事に変換されます。
これは気持ちいい!

実はこの機能、Adobe Dreamweaver CC 2015から標準搭載されております。
16_DW
▲上図はAdobe Dreamweaver CC 2015。同じように変換されます。
※Dreamweaverは新規ドキュメント作成時にDOCTYPE宣言やhtml、head、meta、title、bodyタグは自動生成してくれます。
ですので、上の画面では「ol」から入力しています。

この機能はHTMLタグだけではなく、CSSを書く際にも使える機能ということです。
WEBでググると色々と調べられます。
面白いですね。

長くなりました。
最後まで読んで下さり、ありがとうございましたm( _ _ )m
15 7月

いしきりんもぐもぐ商店街に夏到来?!

ここ数日暑い日が続きますね。
梅雨明けはまだですが、はもうすぐそこですね!!


と、いうことで、
いしきりんもぐもぐ商店街では、
一足お先にがやってきました!


SEGA(c)「PSO2(ファンタシースターオンライン2)」コラボステージが
夏仕様になっています!

pso2bcs33_06_02



▲こちらのパネル画像は、7月12日(日)に開催されたPSO2のイベント、
”セガアークスキャラバン沖縄”で宣伝して頂き、
沖縄の方々にもお披露目する事が出来ました。



今回のアップデートでは、
背景が夏仕様に変わっただけでなく、
敵として登場するラッピーも、
サマーラッピーに衣替えしています。

サマーラッピー確認用


さらに、PSO2ステージは最高難易度となり、とっても難しくなっています!

とてもとても難しいのですが、、
いしきりんちゃん本人が、既に300枚以上を獲得しているので驚いております・・・。

(因みに私は80枚が限界です)



残り1ヶ月半のスペシャルコラボ
です!!



ぜひ、夏仕様になったPSO2ステージでも遊んでみてください★★

「PSO2ステージ」出現期間:2015年4月5日(土)~8月31日(月)
必須環境:iOS7.0以降/Andoroid OS4.0以上
ダウンロード:
【App Store】
https://itunes.apple.com/jp/app/ishikirinnomogumogu-shang/id896588583?mt=8
【Google Play】
https://play.google.com/store/apps/details?id=jp.co.web_cte.ishikirin

価格:無料


竹芸能HP(2015.04.05)
スマートフォン向けアプリ「いしきりんもぐもぐ商店街」に「PSO2」(c)SEGAステージが出現
http://www.shochikugeino.co.jp/topics/2015/04/pso2sega.html


PSO2公式twitter
「いしきりん」と『PSO2』が再びコラボ!
https://twitter.com/sega_pso2/status/584611253772886016



記事検索
ギャラリー
  • 行ってきました「IGAS2015」!
  • 行ってきました「IGAS2015」!
  • 行ってきました「IGAS2015」!
  • 行ってきました「IGAS2015」!
  • 行ってきました「IGAS2015」!
  • 行ってきました「IGAS2015」!
  • 行ってきました「IGAS2015」!
  • 行ってきました「IGAS2015」!
  • 行ってきました「IGAS2015」!
  • 行ってきました「IGAS2015」!
  • 行ってきました「IGAS2015」!
  • 行ってきました「IGAS2015」!
  • 行ってきました「IGAS2015」!
  • ちょっとWEBのお話…。~Emmet編~
  • ちょっとWEBのお話…。~Emmet編~