こんにちは。
新卒2年目デザイナーのshinoです。
制作職、特にデザイナー・コーダーのみなさんは、通勤時間などのスキマ時間にスマホでウェブサイトを見て、「あ！このデザインいいな！」「この配色ステキだなあ」「このサイト、どうやってコーディングしているんだろう？」と思ったことがあるのではないでしょうか。
ただ、そういうときほど、PCを利用できない状況だったりしますよね。
わたしは、「会社や自宅に着いてからじっくり見よう…。」と保留にして、そのまま忘れてしまった経験がよくあります笑
できれば、気になったデザインはその場で保存したい！
コーディングもその場で確認したい！
そこで、今回はわたしが日ごろから利用している「デザイナー・コーダー向けちょっと便利なiPhoneアプリ４選」について、良いところと注意点を踏まえてお話ししたいと思います。
1.上から下まで画面をキャプチャー！
アプリ名：画面メモSS
※互換性： iOS 8.0 以降。iPhone、iPad、および iPod touch に対応。
良いところ
スマホサイトの気になるデザインを保存する際に重宝しています！
撮ったスクリーンショットはアプリに保存＆タグでの管理ができるので、あとで探しやすいのもうれしいところ。もちろんカメラロールに保存もできます！
▼例：アプリでホームズサイトのスクリーンショットをとってみた
注意点
transitionなどの効果がついている場合、透過・半透過した状態で保存されてしまうことがあります。
2.お手軽にカラーパレット作成！
※互換性： iOS 4.0 以降。iPhone、iPad、および iPod touch に対応。
良いところ
COLOURloversというサービスと連携しているので、利用の際はアカウントを作成することをおすすめします。
アカウントを作成することで、作成したカラーパレットはPC・スマホ双方で確認・利用することができます！
カラーを指定する方法は何種類かありますが、おすすめは写真からの作成です。
綺麗な風景写真や電車内の広告で気になった配色を、カラーパレットとしてお手軽に保存できます。
▼例：アプリでカラーパレットをつくってみた
注意点
カラー指定はセルフで指定をする必要がありますが、その分こだわったカラーパレットが作れると思います。
3.SublimeText風 HTML Viewer！
※互換性： iOS 8.4 以降。iPhone、iPad、および iPod touch に対応。
良いところ
左にブラウザ画面、右画面にHTMLソースが同時に表示され、それぞれの画面の幅調整も簡単に行えます。
Google検索にも対応しているので、URLを直接打つ必要がないのもいいですね。
▼例：アプリでホームズサイトのHTMLソースを見てみた
注意点
HTML Viewerなので、CSSは確認できないですし、PC画面と比較するとやはり見づらい感じは否めないですが、スキマ時間にサッと見る分にはとても使いやすいと思います。
4.HTMLだけじゃ物足りない！aタグもCSSもScriptもimageもぜーんぶみたい！
※互換性： iOS 4.3 以降。iPhone、iPad、および iPod touch に対応。
良いところ
タイトルのとおり、リンクもCSSもScriptもimageもぜんぶ見れるのがうれしいですね。
特にCSSとScriptはブラウザで見れるようになっていたり、メールで該当ファイルのURLを送れるようになっています。
▼例：アプリでホームズサイトのHTMLソースをみてみた（自動コード折りたたみ済）
▼例：リンクもCSSもScriptもimageもぜんぶ見れます
注意点
有料なので、ダウンロードするには少し敷居が高いかもしれません。
また、HTMLに対応したCSSをピンポイントで見ることはできませんし、自動コード折りたたみ機能はありますが、厳密ではないようなので、場合によっては見づらいと感じるかもしれません。
HTML・CSSをそれぞれスキマ時間にサッと見る分には良いアプリだと思います。
いかがでしたでしょうか？
ご紹介した以外にも、多種多様な使えるiPhoneアプリがたくさんあります。
そのなかで自分にとって使いやすい、お気に入りアプリを見つけてみてはいかがでしょうか。
ほかにも、このiPhoneアプリ使いやすいよ！というのがありましたら、ぜひコメントで教えてください！
では！
