そろそろWebPに切り替えよう。変換方法や対応ブラウザ、使い方を解説！ | Web Design Trends
WebP（ウェッピー）は、Googleが開発している次世代画像フォーマットです。PNGやJPEGと比べてファイルサイズを抑えることができ、トラフィックの削減やページ表示速度の向上を実現することができます。 今回は、WebP（ウェッピー）の基本と、メリットやデメリット、変換方法、対応ブラウザなどをご紹介したいと思います。 WebP（ウェッピー）とは？ WebP（ウェッピー）は、Googleが開発している次世代画像フォーマットで、拡張子は「.webp」です。 WebPは、JPEGやPNGと比べ、同程度の画質の画像をより小さなファイルサイズで保存することができます。Googleの発表では、PNGよりも26%、JPEGよりも25%〜34％程度ファイルサイズを抑えることができると言われています。 また、WebPは背景透過（アルファチャンネル）や、アニメーションにも対応しています。つまり、JPEGのよ
iOS とAndroid の違い クロスプラットフォームのアプリデザインで特に気をつけるべき点｜marin
私が一番最初にAndroid アプリをデザインしたのが2016年の初夏頃で、その頃はまだiOS・Android とデザインが違うのが主流でしたが、2021年現在のアプリはiOS もAndroid もプラットフォームごとの細かな違いはあれどほぼ同じデザインが主流となっています。 これは2016年の10月にAndroid APIがBottomNavigationView に対応してからじわじわ浸透していった変化だと考えているのですが、その辺の歴史の話は省略します。プラットフォームは違えどスマートフォンアプリである以上デザインは同じ方が楽なので、共通化されていったのは自然な流れだと思います。実際両者が全然違うUI・デザインだと大変ですしね……。 とはいえ、プラットフォームが違うので全て同じというわけにもいきません。iOS にはHuman Interface Guidelines、Android
UIデザインと守破離の精神｜Goodpatch Blog グッドパッチブログ
デザイン業務ではしばしば“奇抜さ”が求められることがあります。人間は常に新しい形や刺激的な表現を求めていて、誰もが思いつくようなものでは受け入れられないことも多々あります。そのことは十分に承知の上で、私は良いデザインとはどこか“普通の形”をしているものだと考えています。普通というとなんだかネガティブにも捉われがちですけれども、環境に融け込んでいて違和感がないという意味で、普通であることはデザインの目指すべき一つの姿なのではないかと思います。はじめ奇抜な形をしていたものが次第に社会に受け入れられていって、いつからか「普通」になっているようなこともあります。｢新しくあること」と「普通であること」は必ずしも二項対立の関係ではありませんが、どちらを取るべきかでしばしば頭を抱えてしまうデザイナーは私を含め多くいらっしゃるのではないでしょうか。 UIデザインの世界を見てみても、やはりどこか「普通ではな
iOS/Androidアプリエンジニアが理解すべき「Model」の振る舞い
iOS/Androidアプリを作る際に理解しておいて欲しい「Model」という役割について説明します。わりと意識していないケースがあるので、チェックしてみてください。
続エンジニアだけでアプリアイコンを作る - Shoichi Matsuda's diary
昨日「エンジニアだけでアプリアイコンを作る」を書いたのですが、500はてブ以上と思わぬ反響をいただいて驚いています。 ほぼツールの紹介だったので大方予想はできていたのですが「で、結局絵はどう書くの？」といったコメントを多くいただきました。 このあたりについてもどのようにやってきたかをざっくりですが紹介しておきたいと思います。 アイコンを書けるようになるまで 模写する 勉強する 自分なりに作る（ゴール） ざっくり言うとこの３つの手順です。 あくまで「なんとか書けるようになるまで」なのでデザイナーさんから見ればまだまだなレベルにしか到達しないでしょうが、やれないよりはマシなはずです。 模写する まずは今あるアイコンと同じものをとにかく作っていきます。 ここでの主な目的はツールの使い方を把握することです。（前記事ではInkscapeを紹介しました） 10個ほど作ればおそらくツールの使い方はほとん
『３分で分かるフラットデザイン』
1 pixel｜サイバーエージェント公式クリエイターズブログ サイバーエージェントのクリエイターの取り組みを紹介するオフィシャルブログです。最新技術への挑戦やサービス誕生の裏話、勉強会やイベントのレポートなどCAクリエイターの情報が満載です。 はじめまして。 2013年度新卒入社、DETOXでデザイナーをしているSonokoと申します。 今回はDETOXで用いたフラットデザインについてお話したいと思います。 DETOXとは DETOXとは言いたいことも言えないこんな世の中で、ネガティブな発言や失敗や愚痴を気心の知れた友人同士で共有できるニュータイプSNSです。 「SNS疲れ」などで溜まった現代のココロの闇を「ポイズン」として吐き出せます:) DETOXでは、iOS 7の普及に伴いフラットデザインを搭載しました。 トレンドの「フラットデザイン」ってなに？まずはどんなものか、百聞は一見にしかず
今日から使える！ Sass/compass ゆるめ勉強会
Sass/Compass ってよく聞くけど、なんか難しそう…って思っている主にデザイナー/HTMLコーダーさん向けの勉強会で利用したスライドです。勉強会にはハンズオンが組み込まれていたので、この資料には中途半端な部分がありますがご容赦ください。 (*'-'*) 内容的には、基礎的な事柄を、活用のための考え方を添えて解説しています。何かの参考になれば幸いです。
SmartNews の iOS 7 対応 | SmartNews開発者ブログ
こんにちは。スマートニュース株式会社の町野です。 9月18日の iOS 7 の登場から 1ヶ月半ほど経ちました。既に多くのアプリが iOS 7 に対応し、ユーザーの方たちも段々と iOS 7 に慣れてきたのではないでしょうか。そこで今回は、SmartNews での iOS 7 にまつわる話をご紹介しようと思います。 iOS 7 対応版のリリース SmartNews は、9月18日（日本時間 9月19日）の iOS 7 の一般公開に合わせて、iOS 7 対応版の SmartNews v1.5 をリリースすることができました。iOS 7 の新機能も使ったこともあり、Apple さんには長い間「iOS 7 対応」のアプリとしておすすめしてもらっています。 Apple におすすめしてもらうことはかなり有効です。iOS の開発版配布と一般リリースの時期はだいたい決まっていますので、OS の公開に間に
iOS 7はもっさりか？比較検証してみた | TOKOROM BLOG
今回の記事はUIデザイナの Morino氏 からの寄稿です。 iOS 7が正式リリースされました。既にアップデートを行って実際に試されている方も多いと思いますが、今回はUIに大幅な変更が加えられたために、まだ操作に戸惑いのある方もいるのではないでしょうか。 特にiOS 7にしてから重く感じる、もっさりしているという意見もけっこう多いようです。iOS 7をしばらくいじってからiOS 6の端末を触ると、たしかにiOS 6の方がきびきび動いているように感じます。 今回は半透明やぼかし、視差効果などの画像エフェクトをふんだんに使用しているために画像処理の負荷が高いことも確かでしょう。しかし、全てが端末の性能のせいというわけでもないことを、今回はご紹介したいと思います。 頻繁に操作を行う以下の4つのシーンについて、ちょっとした比較検証を行いました。 ロック解除してから、ホーム画面のアイコンが全て出現
スマホUI考（番外編） 顧客やユーザーの要望に全て対応すると、アプリは99%破綻する | fladdict
顧客や上司、ユーザーの場当たりな要望に対応しつづけると、どんなアプリもゴミアプリになる。たとえそれが理にかなった要望であっても。 なぜなら面積の限られたスマホでは「一画面の機能数とボタン数」が、使い易さと品質に深くリンクしているからです。 ということを、エラい人にプレゼンするのがお仕事の今日この頃。でも毎回毎回、同じことを説明するのがシンドイので資料をブログにまとめたいなぁと思うなど。 思考実験として、ここでは架空事例としてTwitterアプリを例に考えてみる。 何かの間違いで、日本の大手メーカーがTwitterを買収すると・・・UIデザイナーが体を張らないと99%ぐらいの確率でこうなるのです。 ここがオリジナル Request1: ダイレクトメッセージをトップ階層に ユーザーからの真っ当な要望。実際にはサービスの本質ではないのですが、要望はかなり多いはず。 ただTwitter社的にはme
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
10 Steps to Translate Your iOS Designs for Android
UIデザイナーはダウンロードしておこう！iOS 14のデザインテンプレート・UI要素が揃ったAdobe XD用の素材がApple公式からリリース
consim. β
インターフェイスデザインとの向き合い方（公開版）/ How to face interface design
メッシュトランスフォーム
流行に乗っていいの？フラットデザインの落とし穴