iPhone 12で、ビューポートのサイズの種類が増えすぎ！デバイスの複雑さがUIの設計にどのように影響するのか
iPhone 12シリーズが発表され、iPhone 12/12 Proの予約も始まりましたね。23日配送予定で予約できたので、私も楽しみです。ユーザーとしてはその新しいデザインや機能にワクワクしますが、デザイナー・デベロッパーとしては悩みのタネが増えるかもしれません。 ビューポートのサイズの種類が増え、多くの解像度、アスペクト比、断片化が進むデバイスの複雑さがUIの設計にどのように影響するのかを紹介します。 iPhone 12 vs Designers by Michal Malewicz 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 iPhone 12のリリース だけど、このメタルとガラスの中には象がいる 2020年の現状 どのようにデザインすればよいか？ 重要な要素は折り目の上に 終わりに iPhone 12のリリース 1
【実例あり】巨大な印刷物を製作する際の3つの注意点｜dwango creators' blog（ドワンゴクリエイターズブログ）
こんにちは！最近暑かったのでタンクトップで過ごしていたトムです。 室内の冷房が効き過ぎて風邪をひきました。みなさんも気を付けてくださいね！ デザイナーになってから駅や電車、ビルなど街中の看板やポスターなどの広告を目に触れるようになりました。その中でも一際僕を魅了するのは通勤中によく目にする駅の大きな広告。 「大きいのに細部までよく綺麗にできてるなぁ。。。いつか俺もデカいのやってみたいな。」とジーっと眺め、ため息を漏らしていました。 そんな中、今年開催された「超会議2016」で初めて大きな印刷物を担当することに！意外にもすぐに機会が訪れたのです。 普段はweb用の画像などを作成することが多く、大きい印刷物を担当してもB2程度です。経験がなかったため、若干苦戦しながら巨大なデータと闘うこととなりました。 その時に、実際に学んだ製作する際の注意点をまとめたので紹介します。 製作した印刷物 今回担
アプリで利用する画像について - クックパッド開発者ブログ
ユーザーファースト室のhidaka（@kaa）です。 クックパッドアプリ内では元々同じレシピの画像を画面、環境によって様々なサイズで表示しています。 レシピの検索結果でのサムネイルや、レシピ詳細画面、写真の拡大表示時などなど。 その際、端末の解像度にあわせ無駄のないよう、表示領域にあわせて画像をリクエストしていました。 *画像配信にはtofuという配信システムが稼働しています http://www.slideshare.net/mirakui/ss-8150494 これでそれぞれの端末にあわせた画像を配信していましたが、今年あたりからさらに最適化が必要になってきました。 問題1 画面密度の上昇 端末のスペックが上がることにより、１インチあたりのピクセル数が増加しました。 retinaと言われていたiPhone 5で326dpiだったのが去年あたりからの高解像度端末の幅1440pxの機種(a
[CSS]フォントのサイズ指定はpx？ em？ 既存の再検討とこれからのテクニック
フォントのサイズの単位に何を使ってますか？ px？ em？ それら2つのよく利用されるテクニックをおさらいし、さらに第3のテクニックも紹介します。 Font sizing with rem [ad#ad-2] 下記は各ポイントを意訳したものです。 はじめに pxを使ったサイズ指定 emを使ったサイズ指定 remを使ったサイズ指定 はじめに フォントのサイズの単位に何を使用するかは、未だに激しい議論の的となっています。それらのテクニックにはそれぞれ長所と短所があるのも現実です。 それらの中で短所が少なく、よく利用されるテクニックは2つあります。 pxを使ったサイズ指定 emを使ったサイズ指定 これら2つのテクニックを再検討し、さらにもう3つ目のテクニックを紹介します。 pxを使ったサイズ指定 ウェブの初期に、私たちはテキストのサイズを定めるために「px」を使用していました。これは一貫しており
4インチのiPhone5（1,136 x 640ピクセル）画面対応
Copyright (C) iPhoneアプリ開発備忘録 All rights reserved. ブログ内で記したコード、内容の正確性は保証いたしません。 記載内容を実装したことにより発生した不具合・損害等の責任は一切負いません。 解像度が1,136 x 640ピクセルになった、iPhone5の画面への対応手順。 1. 画像 1136 x 640pixelsで画像を作成する。 (1) Splash Screen Default-568h@2x.png (2) その他 xxxx-568h@2x.png ポイント： "@2x"の前に文字列"-568h"を付ける。 "@2x"は、640x960pixelsのhigh-resolusion(Retina Display)を示すが、4インチのiPhone5用の画像ファイル名には、"-568h"を付ける。568は、mainScreenのフレームサイズ
width、height 何て読む!? 今さら聞けない読みにくいCSSプロパティー名の読み方のまとめ
新人デザイナーが最初にぶち当たる試練に、英語があったりします。 自分だけが知らないのかと思って、先輩聞けずなんとなくごまかしているうちに・・・いまさら聞けないし・・・みたいになっていませんか？。そこで今回の記事では、CSSプロパティー関連の英語で読みにくいものをピックアップしてみました。 発音をチェックできるリンクも付けてますので、実際に耳で聞いてチェックしてみてください。 1. text-align アラインです。g は発音しません。 私は昔「アリジン」と読んでいました。蟻人みたいですね。 2. margin こちらは g を発音して、マージンです。 3. width これは難しい！。d の音がほどんど聞こえないし、ネイティブでも発音が揺れるので、一概には言えないのですが、ウィドゥス、ウィトス、ウィズなどと読みます。 ただし、with と区別するために、ワイズと読んだりもします。 4.
【完全版】facebook、twitter、google+、pinterestの画像サイズリスト | ファンブック公式ブログ
こんにちは、ファンブック（@fanbook_inc）です。 この記事では、ちょっとした時に重宝する、facebookで使われる画像サイズのリストを公開します！あわせてtwitter、google+、pinterestのサイズもまとめているのでぜひご活用ください。 ・facebookの画像サイズ タイムラインで使われる画像サイズ カバー画像：851 x 315 pixels プロフィール画像：160 x 160 pixels（ボーダーサイズ：5 pixels） プロフィール画像のサムネイル：50 x 50 pixels アプリのサムネイル画像：111 x 74 pixels アプリのサムネイル画像とサムネイル画像の間：8 pixels
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
https://qiita.com/yoshimana/items/95bad54c8741f7351c79
Loading...
tande lab.
Iosjp.com is for sale | HugeDomains
Flatis