[B! iphone][ui] seckieのブックマーク

スマートフォンのディスプレイ巨大化に伴う、UIデザインの潮流｜Go Ando / THE GUILD｜note

前回の投稿でAppleのFluid Interfacesについての論考しましたが、Fluid Interfacesが生まれた一つの背景として、ディスプレイの巨大化があります。本稿では大画面化するディスプレイへのUIデザインの対応について、現在どの様な流れになっているのか、個人的に観測している中で考察している事をご紹介したいと思います。巨大化し続けるディスプレイサイズ2007年に初めてiPhoneが世に出てから、現在の最新のモデルiPhone XS Maxまでのディスプレイサイズの変遷をまとめたのが下の図です。初代iPhoneとXS Maxを比較すると、物理的なディスプレイ面積は約2.7倍大きくなり、ディスプレイの縦横比は約1.4倍縦長になっています。 iPhone Xから22%縦長化特に著しく変化したのが、iPhone Xが登場した事によってそれまで1.77だった縦横比が2.16まで

seckie 2018/11/04

リンク

iPhone ヒューマンインターフェイスガイドラインチェックシートを公開しました。 : buddhahood log

seckie 2011/02/14

リンク

【スマートフォン】図解！今すぐ直せる、WEBフォーム 6つの課題 (ユーザビリティ実践メモ)

スマートフォン端末の普及で、問い合わせ・申込みなどのWEBフォームがスマートフォンで使われる機会は今後も増えていくでしょう。その際、PC向けに用意していた既存のWEBフォームをそのままにすると、どんな問題が発生するでしょうか？今回は、弊社コンサルタントの自主調査から、スマートフォン端末（特にiPhone）でのWEBフォーム利用時の6つの頻出課題をご紹介します。多くのWEBフォームでは、項目名が入力ボックスの横に配置してあります。 PCでは全く問題のないレイアウトですが、iPhone端末では入力ボックスをタップしてズームインするとラベルが見えなくなり、非常に入力しにくいものになってしまいます。【改善案】＜推奨＞入力例を入力ボックスの上または下に配置する項目名（ラベル）を入力ボックスの上部に配置する ※項目名の位置が変わるとPCで見にくくなるケースも想定されるため、ご注意ください課題2

seckie 2010/09/14

リンク

IPhone "slide To Unlock" Text In WebKit/CSS3 | CSS-Tricks

DigitalOcean provides cloud products for every stage of your journey. Get started with $200 in free credit! There are a couple of WebKit specific properties that make giving text a gradient background possible: -webkit-background-clip: text; -webkit-text-fill-color: transparent; Those will allow the background of the parent element to become the background of the text inside. I gots to thinkin’, i