これは フェンリル デザインとテクノロジー Advent Calendar 2022 12日目の記事です。 「〇〇なら知っておきたい」なんてタイトル、我ながら「大げさだなあ」と思ってしまいます。 それでもそんなタイトルにしたのは、「iOSの文字が小さくなることを知らないままアプリのデザインに携わり、泣きを見た私みたくなってほしくない」という思いがあるからです。半年前の自分に出会えるなら、「絶対に知ってほしい」と伝えたいぐらい、これは重大な問題です。 という訳で、「iOSの文字が小さくなる問題」について、啓蒙していきたい気持ちを込めて書き記します。 「そんなことも知らなかったの？」と笑われてもいいので、私のような思いをする人間を生み出さないためにも、本当に知ってほしいと思います。 iOSの文字が小さくなる問題とは問題の概要一言でいうと「指定通りのフォントサイズで実装したにも関わらず、実際に仕
動機・前提 今更ながら、とある案件でガワネイティブの要望が出てきそうだったので、事前調査としていくつか調べました。 "ガワネイティブ"という表記が一般的なのかは不明ですがこの記事では、 Webとスマホネイティブの間にある技術（ガワネイティブやハイブリッド、クロスプラットフォームなど） で記載したように「アプリ内WebViewで、サーバがレンダリングしたHTMLを表示する」とします。 サンプルとして作ったもの WebView内に表示するHTML https://github.com/noboru-i/sample-html/blob/master/webview.html iOS側のサンプル（playground形式） https://github.com/noboru-i/sample-hybrid-ios WKWebViewを利用しています。 Android側のサンプル https://
*display on phone is technically 2.61x Frame size. This is the “point size” or “@1x” size of a given device. I strongly recommend designing on frames of this size for a given device. (Here’s an explanation of points vs. pixels) Export scaling. This is how much bigger to make a raster image (PNG, JPG) when exporting to take maximum advantage of the higher resolution of some devices. What size frame
Dynamic Type (ダイナミックタイプ) Dynamic TypeはiOS上でデフォルトの文字の大きさを変更する機能です。対応しているアプリの文字サイズを一度に全部変えられます。 大きさだけでなくフォントの種類やスタイルも決められているので、Apple推奨の見た目を簡単に得られるというメリットがあります。その一方で、考慮しなければならない条件がひどく増えてしまう、厄介な機能でもあります。テストの手間を増やすだけでなく、画面設計にも大きく影響を及ぼします。 本文章は、Dynamic Typeに対する備忘録です。 対象OS：iOS9/iOS10/iOS11 対象Xcode：9.4 Dynamic Typeを使うためのユーザー操作 設定アプリに２通り用意されています。 その１：(iOS9 - iOS13) [設定] -> [画面表示と明るさ] -> [文字サイズを変更] その２：(iOS
こんにちは、くだくらげです。最近ははじめてのUIデザインという本を共著で書きました。 おかげさまでたくさんの人に読んでいただいて、コメントをもらえたりして嬉しいです。ありがとうございます！ PEAKSさんから出版しており購入できますので、よろしければ手にとってみていただけると嬉しいです。 peaks.cc 概要 WWDC 2019で新しく発表されたiOS13でOSレベルでのDarkMode設定が搭載されることになりました。MacOSの方は以前より追加されていましたが、iOSではなかったので個別のアプリが各々対応していました。 今回、iOSにもDarkMode設定が標準搭載されたことによって、iOSアプリのダークモード対応が必然的に迫られることになって来るのではないかと思っています。 ダークモードを好んで使う人は一定数存在していて、かく言う私もダークモードを好んで使っています。目に優しいだっ
前回の投稿で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まで
2018年9月6日、ビジネスエアポート六本木にて「米国アップル社、マイクロソフト社、そして国連本部も認めた83歳のアプリ開発者 若宮正子氏登壇！『MY SMART WORK LIFE』セミナー②。世界を魅了する理由に迫る!!」が開催されました。本パートでは、若宮正子氏の生い立ちからアプリ開発に至るまでのエピソードについての講演模様をお送りします。 突然世界中で有名人になってしまった、若宮正子氏の講演若宮正子氏：みなさん、こんばんは。若宮正子です。どうぞよろしくお願いいたします。だいたいの人はみんな「マーちゃん」って言っているみたいなんですけども、戸籍上の名前は若宮正子です。 今日お話しすることは、まず自己紹介。それから、今日のテーマであります「私は創造的でありたい」というお話。それから最後に、最近の活動から得られたものです。といいますのも、私は1年半ぐらい前に、急に「にわか有名人」になっち
ブログメディア「携帯総合研究所」を運営しています。学生時代に開設して今年が16年目。スマートフォンの気になる最新情報をいち早くお届けします。各キャリア・各メーカーの発表会に参加し、取材も行います。SEの経験を活かして料金シミュレーターも開発しています。 iOS 11以降のiPhoneとiPadでは、コントロールセンターからWi-Fiをオフにしても完全オフにはならず“未接続”の状態になります。 Wi-Fiの未接続はWi-Fi接続をいったん解除するもので、未接続にした場所から移動したり、時間が経過するとWi-Fiが再度オンになることから多くのユーザーから不満の声があがりました。5Gではデータ使い放題の無制限プランが導入されたこともあって、これからWi-Fiの利用が減っていくことも相まって不満の多い仕様です。 Wi-Fiを完全オフにするには設定画面を起動して、いくつか手順を踏む必要がありますが、
iOSDC Japan 2018 に採択されたトーク「iOSエンジニアが知るべきProgressive Web Apps開発のエッセンス」のブログ版記事です。 CfP提出後に内容は二転三転しまして、当初は最新Web開発事情について技術的に突っ込んだ内容にしようと目論んでいたのですが、「iOSエンジニア」へ「伝えたいこと」という軸で作っているうちにこの内容に落ち着きました。 当日聞きに来てくださった方、声をかけていただいた方。このような場を下さったiOSDCスタッフの方々にはたいへん感謝しています。 Introduction📛 昨年末 SafariにService Workersが実装され「iOSがPWAをサポートした」というニュースが業界内で話題になりました。 (※Progressive Web Apps 以降 PWA という略称で話します) この時話題になっていたSafariのPWAサ
ほぼ全機能を網羅した、1万字を超える大作だ。 新機能編、Siri編、カメラ編、ユーザーインタフェース編、既存アプリ・設定編に分けてお届けしよう。 ※iOS 12別記事3本を追加（9月19日） 新機能編 アニ文字が進化し、アバターを自作できる「ミー文字メーカー」も 縦横の長さをARで「計測」 USDZに対応した「ARクイックルック」 「スクリーンタイム」の設定方法 AirPodsの「ライブ再生機能」 Face IDの2つの顔 iOS 12で可能に（別記事） iOS 12なら3D Touch非搭載でも文字入力の「長押しトラックパッド」可能に（別記事） iPhone XSとXS Max、iOS 12に専用設定項目（別記事） Siri編 「Siriショートカット」を使えない機種 Siriが提案するアプリ、出番が増える Siriで日英翻訳が可能に パスワードアクセスもSiriで カメラ編 RAW画像
iOS 8の頃より見かけるようになった新しいモーダルビューの形態と、その設計思想、UI としての使われ方について考察します。この新しいモーダルビューのことを私は他のモーダルビューと区別する意味合いで「半モーダルビュー（Semi-Modal View）」と呼んでいますが、実際にガイドライン上でそのような定義がされているわけではありません。「ハーフモーダル」という呼び方も耳にすることがありますが、私は後述の理由からこの呼び方は推奨していません。 今回はパターンとしてあえて区別することで他のモーダルビューとの違いを明確にし、その特徴や仕組み、正しい設計とはどのようにあるべきかを理解しやすくすることを目指します。なお、2019年版のHIG（すなわちiOS 13対応版）からはモーダルビューのスタイルの一つとして Sheet の記述が現れるようになりましたが、今回は Sheet スタイルに限らずもう少
Siriはタイマーをセットするだけの存在ではない。 Kindle読み上げこそが、彼女が最も輝く時なのである。 セールのたびに増え続ける積読を消化するための知見を共有しよう。 読み上げ機能 iOSには画面の読み上げ機能がある。この機能をKindleアプリで使うことで、Kindle本が疑似オーディオブックとなる。知っている人も多いだろうが、やり方を簡単に説明しておこう。 まず準備として「設定」→「一般」→「アクセシビリティ」→「スピーチ」へ行き、「画面の読み上げ」をONにする。 そして読みたいKindle本を開いたら、画面の上から下へと2本指でスワイプする。すると画面の読み上げが始まる。 『ルビ付き＋なし版 口語訳（旧約聖書＋新約聖書）＋文語訳（旧約聖書＋新約聖書）＋聖書地図』 Kindleの画面を開きっぱなしであれば、ページ移動も自動で行ってくれる*1。 ここまでのことはKindle+読み上
はじめに こんにちは。モバイルアプリサービス部の平屋です。 本記事では、iOSアプリをApp Storeへリリースする手順を解説していきます。 標準的なリリースフローに沿って「各工程で必要な作業」をまとめてありますので、リリース作業時の参考にしていただければと思います。 検証環境 macOS High Sierra 10.13.2 Xcode Version 9.2 (9C40b) 目次 リリース作業の概要 リリースフローについて アプリのステータスについて 1. アカウントや証明書を準備する 1.1 Apple IDを準備する 1.2 プロビジョニングプロファイルを準備する 2. アプリの基本情報を登録する 3. アプリの詳細情報を編集する 3.1 App情報 3.2 価格および配信状況 3.3 {バージョン番号} 提出準備中 4. アプリをアップロードする 5. アップロードされたアプ
![[2018年版] よく分かる！iOSアプリのリリース手順のまとめ | DevelopersIO](https://cdn-ak-scissors.b.st-hatena.com/image/square/345af85fa58540cacdc154ee9f64f0703ce9faf6/height=288;version=1;width=512/https%3A%2F%2Fsiteproxy.ruqli.workers.dev%3A443%2Fhttps%2Fdevio2023-media.developers.io%2Fwp-content%2Fuploads%2F2018%2F02%2Fapp_store_ios11.png)
明示的アクション／暗黙的アクションについてずっと言語化できていなかったので、このたび記事にまとめてみました。馴染みのあるMac OSそしてiOSを例に、画面上のオブジェクトを操作するための二つのパラダイムについて説明します。 2005年頃の Apple Human Interface Guidelines (HIG) を開いてみると、そこには「Explicit and Implied Actions – 明示的および暗黙的アクション」と呼ばれるデザイン原則が示されています。Mac OSのユーザーインターフェイスでは、明示的アクションと暗黙的アクション、この二種類の操作体系が同時に提示され、ユーザーは好きな方法を選択することができるようになっています。 明示的アクション明示的アクションとは、すなわち画面上に明示された手段を選択してコマンドを実行するというものです。Macを例にすると、ユーザー
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
