ホームページ制作・大阪インフォメーションメディアデザイン

06-6809-5021

Column
コラム

WEB制作

APNGを使って美しいアニメーションを実装する方法

これまでアニメ画像といえばアニメーションGIFを使って、簡単なアニメや点滅画像などを作成していましたが、GIFは色数が制限されるため、元画像の色数が多い場合は最大でも256色まで色数を減らす必要があり、透過の場合もジャギが出るなど品質的にやや問題がありました。(ちなみに上のアイキャッチ画像は容量の問題があったため、アニメーションGIFで作成しています)
 
しかし、今はアニメーションGIFに代わる次世代アニメーション画像形式としてapng(Animated Portable Network Graphics)という画像形式が追加されています。
身近なところでいうとLINEスタンプの動くスタンプがAPNG画像を使用しています。
 
そして、昨年からChromeでもAPNGに対応しており、今後益々活躍の場も増えるのではないかと考えられます。
そんなAPNGについて紹介したいと思います。
 
※以下、この記事内でAPNG画像を使用しますが、非対応ブラウザでは静止画として表示されるかと思います。悪しからずご了承願います。

WEB制作

その発想はなかった!おもしろい形のメインビジュアルを採用してるWebサイト

メインビジュアルはサイトの「顔」と言われる部分ですから当然ですが、Webサイトを作る時にデザイン的に一番悩むのは、サイトのメインビジュアルです。
むかしはいくつもの画像を使って合成したり、複雑に組み合わせることが多かったように思いますが、最近は写真を一枚バーンと使っていたり、文字を印象的にレイアウトしたり、動画を背景に使ったり。
 
手法は様々ですが、ただ情報を掲載するのではなく、企業や商品のイメージをデザインに反映し、想いや雰囲気といった目に見えないものをデザイン表現しているWebサイトがたくさんあります。
 
今回はその中でも、こんな使い方があったか!と思わされるおもしろい切り抜き方をしているメインビジュアルをピックアップしてみました。

WEB制作

デザインの参考②ヘッダーの素敵なサイトを集めてみた!

ワンパターン化しがちなパーツのデザインを集めてみた第2弾!
今回はヘッダーのデザインが素敵なサイトを集めてみました。
 
IMDではコーポレートサイトを制作することが多く、「ターゲットの年齢層が幅広いこと」「PCで閲覧される方も多いこと」「様々なコンテンツへの誘導がわかりやすいこと」などから、PCのデザインの場合ヘッダーにロゴとグローバルメニューが入る形で制作することがほとんどです。
ただ、前回のボタンと同じでヘッダーも似たようなデザインになってしまうことが多く毎回悩んでしまいます。
 
そこで、今回はこれまで自分がデザインの参考にしたりいつか試してみたいと思ったヘッダーのデザインを、タイプ別にご紹介させていただきます。

チャレンジ

母ちゃんへテンプレートサイトをあげたら、3年で748万稼いでしまった話(数値の目安編)

母にテンプレートサイトを提供してそこに文書を書いてもらうことで、Googleアドセンス(以下アドセンス)で3年半で748万(現在も進行中)稼ぐ事ができたと言う話の続編です。
 
一応誤解の無いようにに言っておくと、748万といってもあくまで3年半つまり30ヶ月かかったわけですが、これは、毎月748/30=約24.9万円入ってきた訳ではありません。
 
最近こそ、エントリーをストップしても安定して50万前後入ってるみたいですが、最初の一年目のひと月のMaxは5万,2年目は前半は11万円、後半は21万円と加速していく感じで増えていきました。

ITトレンド

写真や動画をiPhone本体に保存せずにGoogleフォトを使う方がいい!!

既に使用している人は大勢いるかと思いますが、「Googleフォト」はご存知でしょうか?
簡単にご説明をすると、撮影した写真や動画をクラウド上に保存をするオンラインストレージサービスです。
Googleアカウントをお持ちの方であれば、どなたでも利用することが可能です。

Googleには様々なツールがありますが、今回は「Googleフォト」にスポットを当ててご紹介していこうと思います。

Adobe Stock
チャレンジ

Adobe Stockのコントリビューターになって実際に写真を売った話。

世の中副業ブームですよね。
アフェリエイトやブログ、メルカリ転売、WEBライターなど、副収入を得る事が出来る仕事は数々ありますが、今回チャレンジしたいのは写真のライセンス販売で副収入を得ることが出来るのかという実験。
 
具体的にAdobe Stockのコントリビューターに登録して実際に写真を売ってみるという話です。

WEB制作

Photoshopの機能「被写体を選択」の精度はどれぐらいなのか検証してみた。

2018年のアップデートで実装された「被写体を選択」という自動選択機能。
人工知能Adobe Senseiが自動的に被写体を検出し、自動で選択範囲として抽出するという機能な訳ですが、この機能が一体どれだけ使いものになるのかを検証してみたので実験の結果をご紹介したいと思います。

WEBマーケティング

Facebook広告のターゲット設定項目を全部書きだしたら1万文字を超えた。ちょっと無意味な項目多すぎなんじゃない

先日お客様よりFacebook広告でのターゲットの絞り込みについて、どんな項目があって、何処まで絞り込みが可能なのかを知りたいとのリクエストを頂いた。
さぁどうやってまとめるかなと項目も隅から隅まで見てみると、あるわあるわ、こんなの必要あるの?と疑問に思うほどの細かな項目が・・・
で、ここにその項目を全て列挙してみたので、なんじゃこりゃって見てもらえれば幸いです。
 
この記事をこのままお客様に見せるわけではないからね。
そりゃお客様のなんじゃこりゃってなるだろうから。

ITトレンド

かゆいところに手が届く!?画期的なWEBサービス5選

最近のWEBサービスやスマホアプリって、その発想はなかったな、っていうような便利なサービスが増えたように思います。
10年くらい前は、要らないものがあったらヤフオクに出品するくらいしか選択肢がありませんでしたが今やメルカリを筆頭に選択肢はたくさんあります。
その他にも便利なWEBサービスやアプリがないか調べてみると、いろいろ見つかったので紹介したいと思います。

Photoshop バッチ処理
WEB制作

Photoshopのバッチ処理でファイル変換を自動化。同じ作業のファイルを一括変換する方法

Photoshopで大量に同じ作業をしないとしなければならない時ってみなさんどうしてます?
100個のファイルに同じフィルター処理を行いたいとか。
EPSファイルを一括でjpegファイルに変換したいとか。
そんな同じ処理を繰り返す作業を自動化していくれるPhotoshopの機能を紹介したいと思います。
 
バッチ処理を活用することで作業の時短を目指しましょう。

12345
お問い合わせ