*

iPhoneのホームにブックマークを追加してもらいたくてアイコンを作った

Adsense

どうも、犬小屋でした。

RSSリーダーを使っているのは割とマニアの方で、
ブックマークが一般的なのかなぁ…とか考え始めています。

犬小屋のブログはiPhoneのホーム画面に置いていただくほどのブログでないのは重々承知してますが、
作ったので手順などを紹介します、

アイコンの作り方は後半に!

まずはブックマークをホーム画面に追加する方法

まずは犬小屋ブログのホームに行きます、

ホームはこちら

20130317101635

Safariの下段にある四角から矢印が飛び出たアイコンをタップします、

20130317101635

ニョキッと出てきた吹き出しの真ん中にある【ホーム画面に追加】をタップします、

20130317101644

出てきたウインドウの右上、追加をタップすると…
(この時に名前を変更することができます、犬小屋と省略したり、犬ブログとか適当に名前つけてください)

20130317101655

ホーム画面にアイコンが出来たと思います、

20130317101711

これでいつでも犬小屋ベースブログに来ることができますよ!
来てくださいよ!そこをなんとかお願いしますよ!!w

それではアイコンの作り方に移りましょう

IllustratorCS3を使って説明しています。

まずは画像を用意するのですが、
アップした時に画像は自動で角丸になります、

その辺も考えながら作りましょう、

犬小屋は255*255ピクセルで作りました、
角丸の枠を付けたかったので
角丸長方形ツールを使って角丸正方形をこの設定で作ります、

スクリーンショット 2013-03-17 10.14.04

その中に収まるようにサクサクとアイコンを作っていきます、
デザインそのものは犬小屋が説明するより
デザイナーさんのブログやHPを見たほうがいいでしょう(;^ω^)

簡単に作りたいならこのようなテンプレートを使うのも良いでしょう、

iPhone icons by ~judge on deviantART

なんやかんやで出来ました、

スクリーンショット 2013-03-17 10.13.40

これをPNGで保存します、

この時に【apple-touch-icon.png】という名前で保存しておくと捗ります、

スクリーンショット 2013-03-17 10.44.08

ファイルが出来たらこの画像をサーバーのルートにアップするだけです、
Safariでブックマークを追加してみるとアイコンにはグロスとか影が付いていると思います、
これが邪魔な場合には【apple-touch-icon-precomposed.png】というファイル名で保存してください、

そうするとアイコンに効果がつかなくなります、

効果を自分の好みにしたい時はこちらのサイトが便利です、

Polish your iPhone app icon

Polish your iPhone or iPad app icon

こちらのサイトに行ってファイルをアップロードします、
その時、サイズは57*57のPNG、72*72のPNG、
512*512のJPGもしくはPNGで保存した画像を使います、

ファイルを選択ボタンを押して画像を選択するだけです、

スクリーンショット_2013-03-17_10.51.32

出来を確認して、セーブすると完了です。

スクリーンショット 2013-03-17 10.57.05

じつはもっとグロスを調整したり影を調整できるサイトもあったのですが、
どうやら無くなってしまったようです(*´д`*)

出来栄えを確認してみよう!

iPhoneのSafariでブックマークして確認してみましょう、
壁紙によって見え方も変わるので微調整が必要にもなったりしますが、
壁紙は人によって違うので全てに対応するのはムリでしょう、
だからこそアイコンに縁取りを入れるのが有効だと思います、

犬小屋の場合は縁取りをステンレス調にしてみました、

作り方は、角丸正方形を大小2つ作り、
そのアウトラインを作って、
グラデーションを反対に入れるだけです、

この縁取りは有名なゲームなども使ってるんできっと良いんでしょう♪

では、納得行くアイコンを作ってください!!

 ふざけた大人のTシャツ屋☆犬小屋ベース

http://www.inugoya-base.com/

関連記事

INUGOYA-BASEのショップページをリニューアルしました!

どうも、犬小屋でした。 犬小屋ベースのロゴを作ったのでそれに伴いショップページをリニューアルです、

記事を読む

WWDC2013で発表ピヨピヨされた中の気になること

どうも、犬小屋でした。 WWDCに合わせて睡眠を取りしっかりみていました、 そこで気になっ

記事を読む

【iPhoneアプリ】モンスターハンターマッシブハンティング 曜日限定クエスト上級報酬一個目

どうも、犬小屋でした。 iPhoneアプリのモンハンマッシブハンティングの曜日限定クエスト

記事を読む

パンクウェアのDOGKINGのオンリーショップOPEN!

とうとう出来ました、パンクでロックな犬服&オーナー服のブランドDOGKINGのオンリーウェブショップ

記事を読む

iPhoneで懐中時計

所さんは最近懐中時計がブームだそうでオークションでちょこっと見てみたら、 土田の稼ぎでは到底手が出な

記事を読む

使い込んだiPhoneがカッコイイと思うのは犬小屋だけでしょうか?

どうも、犬小屋でした。 今回はギズモさんのこの記事を見てつらつらと iPhone 5を2ヶ月使って、

記事を読む

完全に油断していたその時に!閉店くんが行く!に再度犬小屋ベースのTシャツが!

前回の閉店くんが行く!↓で当店、犬小屋ベースのTシャツを着て頂き大喜びしていたのですが、 さすがに

記事を読む

no image

今年もありがとうございました

2011年も、あと12時間を切りました。 いかがお過ごしでしょうか土田です。 土田の正月はお酒で終わ

記事を読む

北海道三笠市のペットグッズショップ プレーリーが変わります!

北海道三笠市で皆様に愛されながら続けてきたペットグッズショップ プレーリーですが、 近々、リニューア

記事を読む

WWDC2011楽しみ

もうすぐWWDCですね、 土田は、なんといってもiCloudに注目しています。 iPhoneやiPa

記事を読む

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

Adsense

#204 マイサマーカー編集後記 日本語MOD来たぞ!!!ありがとう制作に携わった方!! #mysummercar #MSC

どうも、犬小屋でした。   今回の動画の目玉はな

#202 マイサマーカー編集後記 トラクターの操作方法

どうも、犬小屋でした。 ツイッターの方でもツイートしましたが配線

#201 編集後記

どうも、犬小屋でした。   線のつなげ方が未だ完

#200 編集後記

どうも、犬小屋でした。   マイサマーカーの動画

【PCゲーム】MY SUMMER CARのススメ 車の作り方説明 その1

どうも犬小屋でした、 MY SUMMER CARというゲームにハマっ

→もっと見る

PAGE TOP ↑