A complete guide for Apple Displays, Icon Sizes, and more!
はじめに 現代では多くの人々がスマートフォンやタブレットを所持し、ゲームを楽しんでいることと思います。 モバイル向けのゲーム市場は大きく、世界では今も多くの開発者たちが iOS / Android 向けの商用ゲームを作っています。 さて、モバイルゲームの開発には、多くの開発者を悩ませるちょっと困った事情があります。 それは ディスプレイが非常に多くの多様性を持っている ことです。 正方形に近い形のタブレットもあれば細長い端末もあり、カメラがディスプレイの中に割り込んでいたり、 OS が専有する領域があったりと様々です。物理的な大きさもバラバラですね。 そのくせモバイル端末はタッチパネルで、ディスプレイに触れる UI になっているのです。 ゲーム開発を生業とする多くのエンジニア / アーティスト / ゲームデザイナーは、 これまでに何度も頭を抱えてきたことでしょう。 本稿では、2019 年現
モバイル向け開発は機械が様々です。 解像度は様々、アスペクト比も様々です。 最近は一部画面が欠けていて、ある範囲(SafeArea)に収めないと映ること保証しないよ、 という機械まで出てきました。 さて、これにどう対応するのが楽か? 技術部平山が、 弊社東京プリズンで行った手法をベースに、一つの例を示します。 こんなの ここではこんな例を見てみます。 この画面には5つの要素があります。 緑の楕円ウィンドウ。上寄せでsafeArea内にボタンを置きたい。画面幅に対する比率を一定にしたい。 青の楕円ウィンドウ。左寄せでsafeArea内にボタンを置きたい。画面高さに対する比率を一定にしたい。 赤の楕円ウィンドウ。safeArea内の中央に置きたい。どんな解像度でも画面内に収めたい。 右のキャラ絵。safeArea無視して右下寄せで置きたい。どんな解像度でも画面内に収めたい。 背景。画面全域を埋
前回の投稿で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まで
はじめに 本エントリでは先ほど公開した uWindowCapture という Windows において個別のウィンドウをキャプチャできるアセットの解説を行います。本アセットで実現できることは以下のようなものです。 ウィンドウを個別にキャプチャ 背面やデスクトップ画面の範囲外にある部分もキャプチャします デスクトップをキャプチャ uDesktopDuplication よりは低速ですが古い Windows でも動くはず ウィンドウマネージャ ウィンドウの追加・削除や検索 タイトルや位置、大きさなどの情報が取れます デモ 個別画面キャプチャ ウィンドウマネージャ VR 内ウィンドウ自由配置 作った経緯 VR の中ではディスプレイという概念を取っ払った環境が作れるはず!というコンセプトは色々な人が考えていると思います。それを考える上での題材の一つとして、デスクトップをどうするか、もう少し正確には
Image and Video screen captureTime saver for explaining something to your colleagues and clients Screenpresso captures your desktop (screenshots and HD videos) for your training documents, collaborative design work, IT bug reports, and more… Screenpresso is a NEW Light-weight screen grab tool with built-in image editor, user guide generator and sharing options. Get Screenpresso for FREE All Window
TL;DR 夜などの暗闇でスマートフォンを使うときには、目に優しい色使いをしましょう これ is 何 夜な夜なスマートフォンの画面を注視していると、画面の明るさに目が馴染んでしまって、くらいところで周りが見えなくなった体験は無いでしょうか。あるいは、夜車を運転している時にスマートフォンの画面をつけていると、その光がチラチラと視界に入ってきて鬱陶しく感じることはないでしょうか。 この記事では、画面の輝度を変更する方法ではない、暗所でもユーザの目に負担とならないような UI の作り方を見ていきます。 目に優しい色 色の属性 色にも明るさがあります。 HSVモデルやHSL色空間、HSB色空間といったモデルで表される色のプロパティには、V(Value)やL(Lightness)、B(Brightness)といった、明度や輝度と呼ばれる明るさを示すスケールがあります。この値が高いほど色は明るく見え、
AndroidアプリからAPIをつかってスクリーンショットを撮影する方法を紹介します。Android 4.4(SDK Level.20以下)の端末では、Androidアプリからスクリーンショットを保存する汎用的なAPIはありませんでした。特にセキュリティが大きな要因です(記事の末尾に経緯を記載しました。読んでみてください)。 Android 5.0 (Lollipop / Android SDK Level 21)からはMediaProjection APIを使うことで、スクリーンショットが撮影できます。 またGoogleのサンプルプロジェクトではBitmapの取得ではなく、SurfaceViewへの常時反映(ミラーリング、スクリーンキャプチャし続ける)の例があります。Fragmentをつかっており、サンプルとしてはやや複雑な構成です。本記事を読んだあとに参照するとスムーズでしょう。 ht
Qiitaに書いていた【Android】いまさら聞けないdp入門 - Qiitaという記事を更新しました。 (この記事も元々は同じ内容を記載していましたが、両方メンテすると大変なのでQiitaへのリンクページにしました) さすがに公開から1年以上経つとAndroid Developersのリンク切れ(というか関係ないページへのリダイレクト)や古くなってしまった記述が多く、「dpとは」以外の部分はだいたい書き直しました。 また、Android Developersの日本語化されたページで用語に訳がついたものはそちらにあわせています。 差分: 「【Android】いまさら聞けないdp入門」の編集履歴 - Qiita
Android 端末(実機、またはエミュレーター)の画面をリアルタイムで PC 上に表示するツール。 ※製品のデモンストレーション、勉強会などのプレゼンテーションで、自由に利用可 ※静止画も保存可 ダウンロード 新:Ver.3.00 旧:Ver.2.50 [ASM_2_50.zip] (235,929 Bytes) 動作環境 Java 1.5 以降が動作する OS(PC) Android SDK 1.5 以降の端末(実機、またはエミュレーター) ※または adb 互換機(Firefox OS / Google Glass...) インストール Java Runtime Environment(JRE)、または、Java Development Kit(JDK)1.5以降をインストールし、bin ディレクトリへパスを通す Android SDK 1.5 以降をインストールし、tools ディ
Androidアプリのデザインを初めてするときに知っておきたいようなtipsを中心にまとめてみました。ぼくもあんまりAndroidアプリのデザインには慣れてはいないのですが、最近本格的にとりかかる機会があり、わからないながらもあれこれ調べてメモしていたものをまとめました。 これから初めてAndroidアプリをデザインするデザイナーさんが安心して作業にとりかかれるようになればいいなぁ。 デザインを始める前に知っておきたいこと まずAndroidのアプリデザインをする上でハードウェア(ディスプレイ)について理解する必要があります。単にディスプレイといってもAndroidには画面密度が複数あり、見かけ上同じサイズに見えても密度が違っていることがあります。これはiPhoneでいうところのRetinaと非Retinaみたいな感じ。 ここを理解できるかが鬼門ですが、考え方さえわかってしまえば簡単なので
クライアントからシステム開発案件を受注し、開発成果物を納品する際に、エビデンスとして、Excel上に貼り付けたスクリーンショット(以下、スクショ)を、成果物の仕様書や納品書と共に納品する場合がある。この作業は、クライアントに「こういったテストを実行しました」という証拠を提示するものとなる。クライアントに成果物の機能や制限事項などを説明する場合に大変に有効なものとなっているのが現状だ。 実際、Excel上に記述したテスト仕様書や納品書にスクショを張り付けて、成果物の一部として納品しておくと、後々何らかのトラブルが発生した場合も問題解決に大きく寄与することになる。 しかし現実問題として、成果物の機能のスクショを、Excel上に手作業で延々と張り付けていく作業は単純作業であることもあり、開発者にとっては苦痛この上ない作業だ。 そこで、そのような作業を自動化し手助けをしてくれるツールとして「Sel
We built screensiz.es to help you quickly find the screen specifications of the most popular devices and monitors currently on the market. The size data comes from a variety of sources. For a better understanding of Pixel Density, check out this great post by Teehan+Lax. Our “popularity” guesstimates are derived from annualized monthly Google queries (from AdWords traffic estimator), and some fuzz
Graphic designers aren't programmers and sometimes don't know how to properly prepare graphic assets for developers. This simple cheatsheet should help them to do their job better, and to simplify developers' lives. Content Dimensions Screen densities and icon dimensions Google Play asset dimensions Dimension units Size buckets Views dimensions and spacing Action bar height Text size Images and th
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く