Webやアプリのデザイントレンドを紹介。たまに雑談。

Browse By

[Software] Coda 2 Themes – Coda 2のテーマファイルたくさん

  • Pocket
  • このエントリーをはてなブックマークに追加

PanicCoda 2用のテーマファイル(スタイル)を配布しているページ。「Download」からまとめてZipファイルで落とす事ができます。ダウンロードしたファイルは、Coda 2の「環境設定>カラーリング>ギアのアイコン」から一気に読み込めます。Codaってプリセットのスタイル数が少ないので、これを突っ込む事でたくさんのスタイルの中から見やすいものを選ぶ事ができるようになるのがナイス。ただCodaってあまりユーザーいないんですよね・・・。自分の周りだとSublime TextとかAtomとかBrackets使ってる人が多い印象。あ、けどモダン化するっていう次期Dreamweaverにはうっすら期待しちょります。ほんのうっすらだけど。

[Music] Thirty of the Worst Heavy Metal Album Covers of All Time – クソダッサいメタルアルバムジャケット

  • Pocket
  • このエントリーをはてなブックマークに追加

信じられなくほどクソダッサいメタルアルバムジャケットをまとめた記事。メタル野郎ならきっと「これ持ってるわー」的なアルバムがチラホラあるかと思います。いやね、これホントよくこれだけのダサジャケ集めたなーと感心します。ジャケはダサくても中身はクールなアルバムももちろんあるにはあるんですが、やっぱジャケがヒドいと買う気削がれますよね・・・。個人的に思い出深いのはCinderellaPanteraUgly Kid Joeあたり。あと俺ADEMA大好きなんですが、Topple the Giantsのジャケはほんと信じられないほどヒドいw 音楽はイイんですけどねこれ。

[UI Design] iOS Human Interface Guidelines – Apple純正のiOSテンプレート

  • Pocket
  • このエントリーをはてなブックマークに追加

Apple純正のiOS 10用各種テンプレートを用意したページ。App IconやiMessage App Icon、3Dタッチデバイスのクイックアクション用のPSDなどが配布されています。iMessage Appってなんやろ?って思って調べたら、どうもこの画面の時に使われるアイコンのようです。AppアイコンのPSD以外にも、San Franciscoフォントやタイポ作例一覧のPSDなんかも配布されています。ただしダウンロードするにはApple Developer Programのアカウントがいるみたいです。

[Software] QLMarkdown – マークダウンファイル(.md)をMacでクイックルックできるようになる機能拡張

  • Pocket
  • このエントリーをはてなブックマークに追加

.md拡張子のマークダウンファイルをMacでクイックルックできるようにする機能拡張。.mdファイルは中身はただのテキストファイルなので、素のテキストであればエディタさえあれば見る事はできます。けどマークダウンエディタを使えば適切に装飾された形でプレビューできるので読みやすいです。この機能拡張を突っ込むとMacでクイックルックできるようになるのでマークダウンエディタを立ち上げる手間がなくなります。インストールは簡単で、ダウンロードされた「QLMarkdown.qlgenerator」(Download欄のlatestというリンクから行けます)を「~/Library/QuickLook」もしくは「/Library/QuickLook」にコピーするだけ。前者はユーザーフォルダ内のライブラリ、後者はシステムフォルダ内のライブラリです。GitHubからファイルダウンロードした時のReadMe読む際なんかにとっても便利です。

[Typography] Blade Runner | Typeset In The Future – ブレードランナーのタイポグラフィーを検証した記事

  • Pocket
  • このエントリーをはてなブックマークに追加

みんな大好きBlade Runnerの作中に出てくる、大道具・小道具のタイポを検証した記事。Tyrell Corpのロゴから始まり、新聞記事や街中の看板、ディスプレイに表示されるUI、広告に至るまでのあらゆるタイポを検証してます。元になったフォントなどの情報もあるので、Sci-Fiテイストのデザインする時の参考にもなりそう。またタイポ検証だけにとどまらず、舞台やモチーフとなった場所なども紹介されていて、Blade Runner好きにも楽しめる内容。ちなみにこの人、以前にAlienのタイポも検証してます。この時代のSF映画はタマりませんな。

[Wallpaper] Desktoppr – Dropbox同期も使える壁紙検索サイト

  • Pocket
  • このエントリーをはてなブックマークに追加

Dropboxと同期して使う事のできる壁紙配布サイト。各壁紙の詳細ページには、通常のダウンロードに加えてDropbox Syncボタンが用意されているので、ローカルマシンを経由せずに直接Dropboxに保存する事ができます。自分もこの手の壁紙ファイルは全部Dropboxに保存して複数Macで共有しているので、似たような使い方をしてる人には便利な仕組みだと思います。通常の壁紙配布サイト同様、解像度や追加時期、Favの数による抽出もできます。

[Web App] Photopea Photo Editor – PSDファイルを開いて編集できるWebアプリ

  • Pocket
  • このエントリーをはてなブックマークに追加

PSDファイルを開いて、かつ編集までできてしまうWebアプリ。Safariではちょっと表示が崩れるので、Chromeとかの方が良さそうです。サイトを開くとサンプルファイルが開いてますが、実際のPhotoshopと同じようにOpenコマンドから既存のローカルファイルを開く事ができます。試しにファイルを開いてみましたが、ちょっとレイヤースタイルは化けはするものの、それ以外はわりとまともに開く事ができました。Photoshopがない時の代替なんかに使えそうです。

[Web Design] mydevice.io – 各種タッチデバイスのディスプレイ仕様を一覧で見れるサイト

  • Pocket
  • このエントリーをはてなブックマークに追加

各種タッチデバイスのディスプレイ仕様を一覧で見る事のできるサイト。というかトップページはココで、そちらでは自分が使っているブラウザの仕様を見る事ができるというものなんだけど、個人的にこっちのデバイス確認ページの方が便利だなーと思ったのでこちらを紹介。論理ピクセル数、物理ピクセル数に加えて、ピクセルレシオやPPIについても紹介されています。表のヘッダーをクリックするとソートし直しもできます。モバイルサイトデザインする時の指標として使えそうです。