レスポンシブデザインの確認に便利なツールが登場！複数のデバイスサイズで同時確認できる優れもの -Responsivize
Webページのレスポンシブの確認が簡単にできる、新しい無料アプリがリリースされました！ iPhone, Android, Pixelのスマホをはじめ、タブレット、ラップトップ、ワイドスクリーンなどのサイズでWebページを表示して確認ができます。 Windows, macOS, Linux対応のアプリで、しかもオープンソースです！ Responsivize Responsivize -GitHub Responsivizeの特徴 Responsivizeのダウンロード Responsivizeの使い方 Responsivizeの特徴 Responsivizeは、レスポンシブ対応のWebページをさまざまなデバイスのサイズで確認できる便利ツールです！ 当方の日本語環境（M1 Mac, Windows10）で問題なく動作しました。 Responsivize レスポンシブWebサイトの確認が簡単にで
The iOS Design Guidelines - Ivo Mynttinen / User Interface Designer
Updated: 18. October 2020 The iOS Design Guidelines Design great-looking apps for Apple iOS devices. Designing iOS apps can be difficult sometimes, but finding correct and up-to-date information about all of Apples’ devices shouldn’t be. These design guidelines will help any designer who’s building neat things for iOS get started within seconds. About these guidelines These guidelines describe how
【iOS6】 Podcastをミュージック内に復活させる方法 【小技】 : iPhone ～神アプリのススメ～
September 27, 201219:00 カテゴリiOS 6 関連記事iPhone / その他 【iOS6】 Podcastをミュージック内に復活させる方法 【小技】 さて、いつの間にかミュージックとPodcastが別々にされましたが、ミュージック内にPodcastの項目を復活させましょう。 先述しておきますが、『さらにエピソードを入手』するには結局Podcastアプリが必要になります。 お使いのデバイスにApp StoreからPodcastアプリをダウンロードしてあり、iTunesで同期した事がある事を前提に説明していきます。 １．お使いのデバイスのミュージックアプリとPodcastアプリを立ち上げます。 (タスクバーに残すだけですので再生などの必要はありません。) ２．デバイスにプラグを刺してiTunesを起動します。 ３．Podcastの項目をクリックしてPodcastの同期の
iPad ProでUIスケッチできるアプリBluprint をリリースしました
UXデザイナーのiPad Proレビュー記事で、UIのスケッチにいいと。僕自身もスケッチが大好きなので、ものすごく欲しくなって。この記事に挙げられているのが『純正メモ』と『Adobe Comp』なんですけれども、Compは機能が中途半端で、僕はこれを使うならSketchでいいんじゃないか？と感じたので、純正メモでスケッチをしてみました。カメラでいちいち撮影したり消しカスに悩まされることがなくなり、確かに圧倒的に紙より捗るものの、幾つか問題がありました。 Notesアプリで描いたスケッチ毎回画面のスクウェアを描くのが面倒スクウェアは勘で描くので、サイズがiPhoneと同じにならないもちろん解像度もiPhoneと全く異なるアイコンなどを何回も描かなくてはならないMacに転送した場合、画像をトリミングしてからでないとInVisionなどのプロトタイピングサービスに配置できない1画面に2〜3個しか
【お手軽】iOS Safariで表示したWebサイトをMacOS SafariのWebインスペクタでデバッグする方法 | DevelopersIO
はじめに パフォーマンスチューニングをしていてモバイル通信回線を使った計測をしたい時にこの情報を見つけたので、実際に試した方法を残しておきたいと思います。 準備するもの iOS 6以上がインストールされたiPhone/iPod Safari 6がインストールされたMac MacとiPhone/iPadを繋ぐUSBケーブル 事前の設定 MacOS Safariの開発機能 すでにオンにしている方はこの作業を飛ばしてください。 まず、開発機能をオンにします。 Safariを開き、メニューから環境設定を開きます。詳細メニューの下にあるメニューに開発メニューを表示をオンにします。 メニューに開発と表示されていれば問題ありません。 iOS SafariのWebインスペクタ iOS SafariもWebインスペクタの機能をオンにします。 環境設定を開き、Safariの設定を開きます。 Safariの設定
App Storeの弊社デベロッパーアカウント停止に至った 経緯につきまして | 株式会社Nagisa
PDFはこちら 平素より弊社サービスをご利用いただき、誠にありがとうございます。 予てよりプレスリリースにてお伝えをしております、2015年10月07日における、米アップル社運営 App Storeの弊社デベロッパーアカウント停止措置に対する、憶測や事実に反する一部メディアでの報道により、関係各所からのお問い合わせや、ユーザーの皆様からのご心配の声を多数頂戴しております。これらの原因の一つは、弊社によるこれまでの対応が不十分であったとの反省のもと、以下に弊社デベロッパーアカウント停止に至った経緯、既存アプリケーションのアップデートの停止について、および今後のiOSアプリケーションの事業方針につきまして再度お知らせいたします。 ■ App Storeの弊社デベロッパーアカウントの停止の経緯につきまして 米アップル社からのご指摘を受け、規約違反への修正対応を行っております最中での突然のアカウン
Adobe PreviewでiPhoneアプリのデザイン確認
Photoshopを使ってスマートフォンアプリのUIをデザインするコツを学ぶ連載。前回までで作例となる「お天気投稿アプリ」のデザインがひととおり完成しました。連載最終回は、前回仕上げたデザインをエンジニアに渡すまでの手順を追って紹介します。 お天気投稿アプリのUIデザインチュートリアル ▼第2回 1.アプリの配色を考えよう 2.ドキュメントを新規作成する 3.基本的な要素をレイアウトする ▼第3回 4.レイヤー効果を使って質感のあるボタンを作る 5.Illustratorで作ったアイコンを配置する 6.写真を配置してデザインを調整する 7.SNS連携ボタンを配置する ▼第4回 8.実機で見た目を確認しよう 9.パーツ画像を書き出そう 10.ガイドラインの作成 8.実機で見た目を確認しよう Photoshopでアプリのデザインを仕上げたら、iPhone実機に表示しましょう。第1回で紹介したア
iPhone 6 & 6 plusのデザイン対応について【随時更新】 - デザインメモ
iPhone 6とiPhone 6 plusが発表されましたが、アプリのデザインを担当している私がもっとも気になるのが「今のアプリのデザインをどう変える必要があるのか？」。 実際、Appleは謎の解像度にしてしまったため、単純に拡大すれば良いってわけじゃなさそうなので、私なりに調べたこと・わかったことを随時更新していこうと思います！ 最終的には、こうしたら上手くいった！リデザインはこうしたら良い！までもっていけたらと思ってます。 目次 1、画面解像度について 2、画像サイズやデザイン作業について その他 1、画面解像度について 解像度などを比較するインフォグラフィックス ↓ 2014/09/16 up 海外でこんなサイトが公開されていました！ iPhone 6 Screens Demystified – PaintCode 解像度がわかりやすく紹介されています。 iPhone6 plusは
iPhone4 Retina Display対応のデザインのコツ！
僕はどうやったらRetina Displayが綺麗に表示されるか必死に模索する毎日です。（保護シート含め） ということで、今後のiPhone開発に”必須!!!"のRetina Display対応のデザインデータの作り方のコツについてご紹介します！
PhotoshopでiPhoneアプリのUIを作るための準備と設定
WebデザイナーがWebサイトだけでなく、スマートフォンアプリをデザインする機会が増えています。 ところが、Photoshopを使いこなしているデザイナーでも、UIのデザインとなると勝手が違い、試行錯誤している方が少なくないようです。本連載では、Photoshopを使ってアプリのUIをデザインするコツを、デザイナーのハマダナヲミさんが解説します。（編集部） Photoshopはもともと写真編集のためのソフトでしたが、印刷物やWebのデザインツールとしても使われるようになり、いまではデザインツールとしてPhotoshopを使っている方が多いのではないでしょうか。最近ではアプリのUIデザインにも便利な機能がどんどん追加されています。この連載ではWebデザイナーを対象に、iPhoneアプリを題材として、PhotoshopでUIをデザインする方法を紹介します。 第1回は、アプリ開発の大まかな流れを
スマホUI考3 ～ ジェスチャ入力について | fladdict
スマホUI考１ 〜 ボタンについて スマホUI考２ 〜 フィードバックについて スマホといえばジェスチャー入力、ジェスチャーといえばスマホ。そんなジェスチャーについて、つれづれと。 でも個人的には、ジェスチャーはほとんど要らないと思う。 ジェスチャ全般 ・ジェスチャは補助操作。メイン操作ではない。 ・ボタンでできる操作をプラスアルファで、ジェスチャでもできるようにする。 ・なぜならジェスチャの有無は視覚的にわからない。 ・ユーザーがジェスチャを理解しなくても操作できるのがよい。 ・またジェスチャー時に、画面のかなりの部分が指で隠れる。 ・極論ジェスチャなしでもアプリがリリースできる状態なのがよい。 ・つまり予算や工数があまったときに入れよう。 タップ ・マウスクリックではなくタップ。 ・ボタンの精度は指のサイズに依存する。 ・細かい座標指定はできない。 ・ロールオーバーがない。 ・触ってみ
アプリ開発で参考にしておきたい UI デザインパターンまとめサイトのまとめ - Qiita
業務や個人でのアプリ開発で、UI デザインを考えるときに参考にできそうなサイトを紹介します。なかなか個性的・奇抜だったり、少し古い UI が混ざってたりしますが、インスピレーションを働かせる良い刺激になります。 tumblr 多めです。 Behance https://www.behance.net/ Adobe のポートフォリオサイトです。 モバイルデザインのみならずファッションやグラフィックデザインなど、様々なコンテンツが登録されています。 このサイトでは Creative Field という名前でカテゴリ分けされており、アプリ開発においては Interaction Design や Web Design あたりが参考になります。 Pinterest https://jp.pinterest.com/explore/%E3%83%A2%E3%83%90%E3%82%A4%E3%83%A
よくわかるマテリアルデザインの設計コンセプト | fladdict
iPhoneとAndroidではiPhoneのほうが良くできているが、iOSのフラットデザインとAndroidのマテリアルデザインでは後者の設計が優れている。マテリアルデザインは、デザインとエンジニアリングが高いレベルで融合していて、ロジカルで非常に美しい。 以下、自分の理解をまとめたメモ。 紙とインク マテリアルデザインは「ペーパー」と「インク」のメタファーでできている。 ペーパーの特徴 バーやボタンといった画面上のUIコンポーネントは、バーチャルな紙でできたカードと考える。また、このペーパーは1dpの厚さを持っている。 ペーパーは純白の矩形、あるいはシンプルな円形である。三角や星型といった複雑な形はとらない。そのような複雑な形状や模様はインクが担当する。 現実とことなり、このペーパーは自由に伸縮することができる。 マテリアルデザインにおけるレイアウトは、複数のペーパーを並べたり、重ねた
Macユーザー必見！手軽にスマホを動作確認できるiOSシミュレーターをご紹介 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは。ディレクターのエリカです。 スマートフォンサイトの制作で面倒なのは、実は、実機での動作確認だと思います。 PCからスマートフォン表示を確認する方法はいくつかありますが、今回はMacユーザーにぜひ使って欲しい便利なツールをご紹介いたします！ iOSシミュレータとは？ Appleの開発者向けツールXcodeに含まれるiOSのシミュレータソフトです。Mac上で、iPhoneやiPadの環境をシミュレートすることができます。他のシミュレータソフトと比べて次のような特徴があります。 Appleが正式に配布しているMac標準アプリケーションなので、動作が軽い iOSの再現がかなり本物に近く、実機との差が少ない ※ゼロではありません！ 最終確認は必ず実機で行いましょう。 シミュレーターを起動するまでの手順 まずは、起動するまでの手順をみていきましょう。 1. Xcodeのダウンロード、インス
月300円でNatureダイジェストが読める新アプリ、これイイわ - アレ待チろまん
2014-05-06 月300円でNatureダイジェストが読める新アプリ、これイイわ ガジェット 科学 創刊記念で最新号は無料ですってよ、奥さん NatureダイジェストのiOS/Androidアプリがリリースされました。Natureに発表された注目の科学論文を日本語で解説するNatureダイジェスト、科学情報に飢えている人は是非抑えておくべきでしょう。このブログの記事とはクオリティが違います。Nature ダイジェストNature Publishing Groupニュース無料さて、このアプリは本当に使いやすいのでしょうか？実際に試してみましたので、気になっている人は参考にどうぞ。 300円払うだけでバックナンバーが16冊読めるNatureダイジェストは1冊850円で販売されています*1。街の書店に置いてあるのを見たことがある人もいるのではないでしょうか？Natureが1冊12,186
Photoshopでの作業がはかどる！ウェブデザイン（特にスマフォ）用の効果的な環境設定のまとめ
Photoshopでウェブページやスマフォページのユーザインターフェイスをデザインする時に、最も良い結果がでる最適な環境設定を紹介します。 最後の「作業のパフォーマンスを向上させる設定」はウェブデザインに限らず、Photoshopの動作がもっさりしている人は見直してみてください。 How To Set Up Photoshop For UI Design 下記は各ポイントを意訳したもので、画像は当方のPhotoshop日本語版です。 ※当ブログでの翻訳記事は、元サイト様に許可を得て翻訳しています。海外の多くのブロガーからあのブログでの無断翻訳・転載の声を聞くのでご注意ください。 環境設定はiPhone用を例にしていますが、基本的なポイントは全てのウェブデザイン作業に適用できます。 新規ドキュメントの設定 スナップの設定 テキストの設定 光源の設定 グリッドの設定 画像を書き出す時の設定 R
「Objective-C」「iPhoneアプリ開発」が学べるYouTube動画を探してまとめてみた（全9種23動画+α）
「そういえば最近iPhoneアプリ開発について何もやってないなー」と思いつつ「ほとんど忘れてしまったから改めて基本から学びたいなー」とか思いつつ「そうだ、最近は良い動画とかあるんじゃないかな」とか思ったので、YouTubeでObjective-Cを勉強できる入門動画を探してみました。 iPhoneアプリ開発動画の目次 1. iOSアプリ開発講座 2. Objective-C入門 3. iPhoneアプリ開発Objective-C+Xcode入門講座 4. なんとなく分かった気になるiPhoneアプリ制作 5. 誰でもできるiPhoneアプリの作り方 6. 小学生から始めるiPhoneアプリ開発 7. iPhoneカウンターアプリの作り方 8. ドットインストール「iPhoneアプリ開発入門」 9. iphoneアプリ開発 1. iOSアプリ開発講座 iOSアプリ開発講座 第１回 – You
【iOS7対応】iPhone盗まれた私が痛感した、盗難／紛失の際に真っ先にやるべきこと＆事前に必ずしておきたい設定まとめ | カミアプ
【iOS7対応】iPhone盗まれた私が痛感した、盗難／紛失の際に真っ先にやるべきこと＆事前に必ずしておきたい設定まとめ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ある人がカンボジアで一人旅をした時、近くにいたガードマンさんに写真撮影を頼んだらジャケ写のような写真が出来上がった「すごい技術」
コレ凄い！Wi-FiなくてもBluetoothだけでMacからiPhoneにテキスト＆画像を転送できる「Scribe」 - iTea3.0
