ダークモード

📱 LINE着せ替え作ってみた。

🌙 ダークモード(ダークテーマ)用LINE着せ替え

iOS / Android共にダークモードが実装され、いろんなアプリがダークモードに対応してきています。LINEも公式テーマで「ブラック」というのがあるのですが、これが黒すぎるので自作してみました。

💡 作ってみて分かったこと

●思ったより簡単。
●作る画像数は多いけど、iOS/Android共通なのでデザインは多くない。
●全体の配色

もっとみる

ダークモードが懐かしい

1984年にMacintoshが発売されるまで、パソコンのディスプレイの表示は黒地だった。

そう、最近のMacのダークモードみたいにね。
Macintoshは、ディスプレイに表示されるエリアをデスクトップと呼び、それは「あなたの机の上を模倣したものですよ。そこにファイルを拡げて、絵を描いたり、テキストをタイプしてください。もちろん、拡げるファイルはあなたがいつも使ってる紙と同じ白い色です。」と言

もっとみる

sketch color systemの使い方〜ダークモードのUI考察〜

2019年9月に発表されたiOS13

標準でアプリの表示モードをライトかダークモードかを選択できるようになりました

UIがきちんと作られているアプリは

切り替えるとライトモードかダークモードの表示を変えてくれるそう

ということはUIも明るい背景の時とダークモードの背景の時を

考えて作っていかないといけません

UI作成時にライトモードダークモードを×2で作っていくのは

なかなか大変だと

もっとみる
スキ

noteアプリは、ダークテーマには対応しないのかな。ダークテーマ(iOSだとダークモード)を使い始めると目に優しいこと、この上なし。

素敵です。
1

ダークモードUIの最適化

NTTレゾナントテクノロジー アジャイルデザイン部UI/UXデザインチームの呉です。
今年の9月、世界二大モバイルOS(AndroidとiOS)はそれぞれ「Android 10」、「iOS 13」をリリースしました。今回は新しく実装された機能「ダークモード」のUIデザインについてお話をしたいと思います。
※Androidの正式名称は「ダークテーマ」ですが、ここでは便宜的に「ダークモード」と記述しま

もっとみる

【iOS13】アプリアップデート

こんばんわ!KIYOtakaです。

新型iPhone発売から今月2度目の3連休を5連勤という形で乗り越えたばかりです(笑)

で、先日喫煙所で最新iOSの使い方がわからないという若目の男性達の会話が聞こえてきたので、ちょっと共有してみますね。

その会話の聞こえた部分は「アプリのバージョンアップが出来ない」とのこと。

今回のiOS13では、今までAPPストアのメニューにあったアップデートのペー

もっとみる

個人で出している小さいiOSアプリをダークモード対応しました

私は趣味で制作したiOSアプリを1本ストアで公開しています。今回、iOS 13のリリースに合わせて、小規模ですがダークモード対応をしましたので簡単に感想を残したいと思います。

スクリーンショット

やったこと

UITableView などの標準的なコンポーネントを使っている箇所がほとんどということも幸いし、beta版の Xcode でビルドした段階で8割程度の画面で正しく表示されているように見

もっとみる

ダークモードと色彩の話

こんにちは、コニーです!
今回はiOSDCに行ってきた時に興味深いな〜〜〜と思ったものを一つずつご紹介していきます!!

iOSDCすごいの!人が!後なんかびっくりするくらい一つ一つ面白かった!!!その中でも個人的にへえ〜〜ってなったものを紹介してくよ!長くなりそうだから一つにつき一つのnoteを書いてくよ!!

難しい色の話に負けない

これはしもとりさんという方がお話ししていました。
内容とし

もっとみる

メディアクエリを使ってOSのダークモード設定を取得する方法

はいどうもーUIデザイナーのうっくんです。

以前CSSとjQueryを使って簡単にウェブサイトをダークモードに対応する方法をご紹介しました。

もうすぐ公開されるであろうiOS13ではOSレベルでダークモードがサポートされることもあり、せっかくなのでOSの設定に応じてウェブサイトもダークやライトの変更ができればより良いかと思います。

実はCSSのメディアクエリという書き方を使ってOSのダークモ

もっとみる
大当たり!
3

CSSだけでWebページをダークモード対応。ついにChromeにも対応した prefers-color-scheme が超便利

prefers-color-scheme という設定値を使うことで、Webページをかんたんにダークモード対応させることが可能です。Chromeでも本日公開された76から対応されたので、かんたんに紹介します。こちらもあわせてどうぞ↓。

prefers-color-scheme とは

media queryの1種で、CSS上からユーザーがOSでダークモードをONにしているかどうかを判別できます。た

もっとみる