PCとモバイル両方に使える無料UIデザイン素材集35選 ｜SEO Japan by アイオイクスSEO Japan｜アイオイクスのSEO・CV改善・Webサイト集客情報ブログ
ちょっとご無沙汰していた無料素材系の記事を金曜午後にご紹介。今回はPC＆モバイルに使える無料のUIデザイン系素材セットです。 — SEO Japan 最近は多くのグラフィックデザイナーが無料のウェブキットを提供している。4年前はウェブで無料素材を見つける自体が難しかった状況と比較すれば、素晴らしいの一言だ。 私自身もデジタルアーティストとして仕事をしているし、日常的にウェブのインターフェースキットを使って仕事をしている。仕事のスピードははかどるし、私自身のデザインの知識も上がっていく。私が真のプロフェッショナルかどうかは分からないが、チームワークで仕事をすることの力も感じている。今回の記事では私が気に入っていおる35のウェブ用インターフェースキットを紹介したい。
絶対見ておきたい有名企業のスマホサイトまとめ (1/5)
この記事で取り上げているスマートフォンサイトの「BEFORE & AFTER」を以下の記事で紹介しています。合わせてご覧ください。 日本のスマホサイトは2年間でこんなに変わった iPhone、Androidの普及を背景に、スマートフォンのブラウザー向けにコンテンツや表示を最適化した「スマートフォンサイト」（スマホサイト）を開設する企業が増えている。当初はiPhone（iOS）の標準UIに倣った画一的なデザインが多かったが、最近では独特のレイアウトや斬新な色使いの個性的なスマートフォンサイトも増えてきた。 ここでは、Web制作者が見ておきたいスマートフォンサイトを紹介する。実務で参考にできるように、対象を日本語の企業サイトに絞り、業種別に分類してまとめた。スマートフォンサイトの制作に入る前にチェックしておこう。
クオリティの高い、iPhone、iPad、PCとマルチに使えるフリーワードプレステーマ集
TOP > WordPress > クオリティの高い、iPhone、iPad、PCとマルチに使えるフリーワードプレステーマ集 非常に使い勝手の良いCMS、Wordpress。国内でも多くの方が利用されていますが、今回紹介するのはiPhone、iPad、PCとマルチに使えるフリーワードプレステーマを集めたエントリー「」です。 Yoko ここ数年でWEBを閲覧する環境は劇的に増え、最近は考えておかないといけない事項の一つとなってきました。スマートフォン専用のテーマを創るというのも時間がかかるので、初めから対応というのは、ユーザー層によっては大きなメリットだと思います。いくつかのテーマが紹介されていますが、今日はその中から気になったものを紹介したいと思います。 詳しくは以下 iTheme2 アップルライクなフリーテーマ。iPhone、iPad環境化でもデザインテイストは生きているような気
スマートフォンからのアクセスをJavaScript, jQuery, node.js, PHP, ASP, Perlなどで検出する -Detect Mobile Browsers
スマートフォンからのアクセスをJavaScript, jQuery, node.js, PHP, ASP, Perlなどで検出する -Detect Mobile Browsers Detect Mobile Browsers [ad#ad-2] 現在、配布されているのは15種類です。 Apache ASP.NET ColdFusion C# IIS JSP JavaScript jQuery nginx node.js PHP Perl Python Rails いくつかコードもご紹介。 Apache RewriteEngine On RewriteBase / RewriteCond %{HTTP_USER_AGENT} android.+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobil
スマートフォンサイトをデザインする上で知っておくべき10のTIPS
スマートフォンサイトをデザインする上で知っておくべき10のTIPS iPhoneやAndroidのスマートフォンの仕様を知らないけどデザインしなくちゃいけなくなったというデザイナーさんに知っておいてもらいたい10(+1)のTIPSです。 1.実機で確認する 当たり前のことですが作成したデザインを実機で確認して下さい。スマートフォンとPCでは目からの距離やDPIが違いますので、PCでは十分に見れたからといって実機で確認すると文字が小さすぎることなどがよくあります。書きだしたJPGをFTPでアップして確認してもいいですし、メールでスマートフォンに送って確認してもいいです。個人的にはDropboxで転送するのが手軽でおすすめです。 2.横幅は320pxもしくは640pxでデザインする スマートフォンでは基本横幅が320pxで表示されるのでデザインする際も320pxでデザインしましょう。ただ、Re
スマフォ対応の洗練されたUIエレメントがすぐに実装できるCSSとJSの開発キット -Skeleton
Forms -フォーム [ad#ad-2] Skeletonの特徴 スマフォ対応のグリッド Skeltonでは軽量の960pxのグリッドシステムを採用しています。 ブラウザやタブレット、スマートフォンなどスクリーンのサイズが小さくなると、そのサイズに最適なレイアウトに変更します。 Fast to Start 洗練されたベーシックなUIエレメントをあらかじめ用意してあるので、すばやくサイトの制作が始められます。 Style Agnostic SkeltonはUIのフレームワークではありません。最もベーシックなスタイルを提供していますが、あなたの好きなデザインを適用することができる開発キットです。 Skeltonの対応ブラウザ・デバイス Latest Chrome (Mac/PC) Firefox 4.0, 3.6, 3.5, 3.0 (Mac/PC) Latest Safari IE9, I
スマートフォンサイトのデザイン集サイトのまとめ｜WEB Drawer -WEB制作に関するメモサイト-
最近普及しているスマートフォンですが、その専用のサイトを作っている所も多くなってきました。 WEB制作の会社でもスマートフォンサイトを制作する事が多くなってきたと思います。 スマートフォンは指で操作するのでパソコンとはまた違ったデザインになっています。 そこで、デザインをまとめているサイトをまとめてみました。 優れたiPhoneサイトデザイン集 – iPhoneデザインボックス 優れたiPhoneサイトデザイン集 – iPhoneデザインボックス 全iPhoneサイト一覧｜iPhoneサイトデザイン集のiPhoneデザインアーカイブ 公式サイト 全iPhoneサイト一覧｜iPhoneサイトデザイン集のiPhoneデザインアーカイブ 公式サイト スマートフォンサイト集めました。 スマートフォンサイト集めました。 iShowcase – 国内のiPhone / iPad最適化対応をしたサイトを
ブログやWebサイトをスマートフォン向けに最適化してくれるWebサービス・Mippin Mobilizer
なかなか便利だなと思ってご紹介。 自分のブログなどをスマフォ向けに 最適化したいけど時間が無かったり スキルがなかなか追いつけなかっ たり、という方も多いかと思います。 Mippin Mobilizerはその最適化を してくれるWebサービスです。 要はRSSを使ってこのWebサービス上でスマフォ向けレイアウトにしてくれる、というものですので、アドレスはMippin Mobilizerのドメインを使います。この点はmobifyと同じですね。 日本でもガラケー向けに最適化してくれるサービスがあります（名前忘れた）が、そのスマフォ版のようなもの。コーディングやマークアップも知識も不要で、マウスのみで作成可能です。 アドレスを入力する 最適化したいサイトのURLを入力します。矢印をクリックすると右側にプレビューが表示されますよ。RSSが発行されていればどんなサイトでもOKです。同時にレイアウトを
目が見えない人のためのスマートフォンは、デザインも機能もファンタスティック！
いやはやスゴイ携帯の登場です。このシンプルでスタイリッシュなデザインの携帯電話は、目が見えない人のためのスマートフォンなのです。 デザインは、韓国のデザイナーYoungseong KimとEunsol Yeom によるもので、韓国語で「見ること」という意味の「VOIM」と名付けられました。視覚障害者のコミュニケーションを、より便利に、豊かに、円滑にするためのデザインです。 前面は全面シリコンパネル、裏面にはカメラとイヤーピースがあるだけのシンプルさですが、その機能は多彩です。のっぺりとしたシリコンパネルには、ユーザーに何かを伝える時に点字を浮かび上がらせることができます。カメラで文字を読み込めば、その情報をBluetoothを使ってイヤーピースから音声として出力することもできますし、カメラを前にして首から「VOIM」を下げて歩けば、前方にある物体を認識して音声で知らせることもできます。 デ
知っておきたいAndroidの基礎知識と料金を徹底掘り下げ (1/7)
今冬から来春にかけて、Android搭載のスマートフォンが一気にリリースされ、日本の“ケータイ”が一気に変わろうとしている。実際にこれらの新製品で“スマートフォンデビュー”を飾ろうと考えている読者も多いのではないだろうか。 本特集では最新端末の紹介はもちろんのこと、端末の選び方や最初に入れておきたいアプリケーションなど、Androidデビューに必要な情報を解説していく予定だ。今回は購入前に最低限知っておきたい基礎知識と各社の料金を紹介する。 Androidスマートフォンって一体何なのだろう？ iPhoneとはどう違うの さて一口に「Android」と表現されるが、Androidは一体何で、iPhoneとはどう違うのだろうか？ まずAndroid自体はグーグルが提供するスマートフォン向けのOSである。このAndroid（Android OSとも呼ばれる）を搭載しているのが、「Xperia」や
【レビュー】最強のAndroid携帯｢Nexus S｣を触ってみた
速くて、自信たっぷり。 こんな生きのいいAndroid携帯見たことない！ Gingerbread（Android 2.3）と｢Nexus S｣を約1時間触ってみた感想を｢好きなところ｣と｢好きじゃないところ｣の2本立てで、どうぞ。 好きなところ• 高速 これはソフトウェアに負うところ大ですね...プロセッサは既に大量に出回ってるGalaxy S携帯と一緒なので。iPhone現行モデル並みに速く感じるAndroidはこれが初めて。詰まりもラグもなく動作はピュアでサクサクです。アプリの立ち上げもタッチの反応も。Androidはこうでなくちゃ。 •細部のこだわり リストの終わりのところを押すとオレンジ色に光り、画面がオフになる時はTV消すとき出るみたいなアニメーションが出ます。マカーもこうした細かいこだわりでアップルが好きなように、ディテールはとても重要。毛皮の毛布に身をくるんでるような、トータ
スマートフォン最適化を実施する際に最低限抑えておきたいこと : LINE Corporation ディレクターブログ
こんにちは。livedoor グルメを担当している澤田です。 livedoor グルメでは3月に、iPhone版Safariブラウザでの表示最適化に対応いたしました。これは、iPhone版Safariブラウザでlivedoor グルメを閲覧した際に、PC版の画面ではなく、iPhoneの表示サイズや使い方に合わせてカスタマイズされた画面を表示させるものです。 最適化されてないサイトの場合は、基本的にPCと同じ画面がiPhoneに表示されるので、表示される画面が小さく、大量の画像データなどを読み込むため表示に時間もかかります。 この「最適化」の作業を行うことで、iPhoneユーザーにとって必要な機能を、より使い易いナビゲーションで提供できるようになります。 今回はその画面開発時に、ユーザーの使い勝手に留意して設計した、いくつかのポイントについてご紹介します。iPhoneをお持ちの方は、ぜひSa
必見！携帯サイトをお手軽にiPhoneやスマートフォンに対応させる方法 - 適当な日々
フリーランスでwebの仕事をしながらwebサービスとかを作ったり作らなかったり、成長と挫折の記録・・・かもしれないiPhoneの登場でスマートフォンで閲覧しやすいサイトの需要が高まってきたようです。 でもわざわざiPhoneやスマートフォン向けにサイトを作るのは大変・・・。 そんな方に、今までに制作したモバイルサイトをスマートフォン対応させる方法があります。 しかも5分でお手軽にできます！ htmlとCSSで解決する方法なのですが、実はこの方法を使うだけで開発もしやすくなる優れものです。 論より証拠ということで、まずはこちらをご覧ください。 （PCからでもオッケーです。htmlはこちらの記事で作成したものを使ってます。） まず、こちらが普通に作成したモバイルサイト→before そしてこれがその方法を使ったもの→after やっていることは閲覧しているブラウザに応じて、3つの
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
iPhoneデザインボックス
スマートフォンサイトを10分で作成
iPhoneやAndroidなどのスマートフォン向けUIの専門ギャラリーサイト・lovely ui
[Webデザイン]iPhone スマートフォンサイトのデザインのまとめ | CSS Lecture
[CSS]Media Queries（メディア クエリ）を使用したデバイスごとの指定方法のまとめ
Engadget | Technology News & Reviews
実践！iPhone＆Androidサイト制作ガイド