Skip to main content

それでも私がSketchを使い続ける理由。

ついにUIデザインツールの大本命とされていたAdobeのProject CometがAdobe Xdとしてリリースされた。
学生時代から10年近くAdobe製品を使い続けていたが、UIデザインでの使い勝手の悪さにウンザリし、ようやく重い腰をあげてSketchに移行したところだった。
そんな中、Adobe Xdは「またAdobeに戻ってもいいかも」と思えるぐらい、Sketchのシンプルさとプロトタイピングツールのエッセンスがうまく統合されていて心が揺れ動くプロダクトだ。
まだプレビュー版で機能などは限定的なので、正確に評価することは難しいが、Adobeが持つ他ツールとの親和性やマーケティング力を考えると、Sketchや既存サービスにとって大きな脅威となるのではないだろうか。
Adobeが強力なツールを出してきた中で、それでもSketchを使い続ける理由はあるのか。

UIデザインに携わる人にとって悩ましいところだが、Sketchの未来はまだまだ明るい。
単純に機能を比較するだけでは測れないような価値がSketchにはあるからだ。

UIだけでなく、プロセスをデザインできる。

プロトタイピングはProttやFlinto、プロジェクト管理まで含めるならInvision、エンジニアとの連携ならZeplinなど、Sketchと親和性の高いサービスが続々と登場している。
Sketchなら、これらをうまく組み合わせることでプロトタイピングやコミュニケーション、開発に至るまでのあらゆるプロセスを効率よく進めることができるようになっている。
質の高い無料のUIテンプレートや素材が無数に存在する中で、表層のグラフィックが作れるだけでは半人前。 UIデザインは意図したデザインが機能するように、ビジネスとエンジニアリングの間を行き来しながらコミュニケーションをうまく行っていくことの方が重要だ。
現状、Adobe製品だけではプロセスに関わるツールを完全にカバーすることは難しい。ここに今後もSketchを使い続けるメリットが充分にある。
PhotoshopとSketchでIntegrationのトレンドを比較してみると、Photoshopは下降気味。SketchはちょうどUIデザインがより重要視されはじめた2012~2013年急激に普及して逆転しており、大きく期待される存在になっている。

ユーザーがプロダクトづくりに参加できる。

正直、Sketchは大嫌いだった。心地良くない文字詰め、謎に空きすぎる行間、独特の描画方法のペンツール…。
Adobe製品と比較して出来ないことだらけで、使い始めた頃は不便も多く「全く使えない」という印象だった。
しかし、Github上でData PopulatorやNote bookなどのSketchプラグインがどんどんオープンソースで公開されていくことで、不満を持っていた機能の欠点を補って余りあるぐらい便利になり、Sketchの未来を信じても良いかも、と思えるようになった。
バージョンアップやGithub上でのディスカッションも活発に行われており、ユーザーがユーザーのためにSketchの価値に大きく貢献し、プロダクトづくりに参加している。この流れは今後プラットフォームとして見た時にとても強力なものになる。
Facebookやtwitterが開発者に対してオープンすることで大きくネットワークを広げていったように、ユーザー自身がプロダクトをより良くしたいという想いと、Sketchのオープンな思想が交差することで使い勝手は加速度的に高まっていくのではないだろうか。
Sketchのウェブサイトのグローバルナビゲーションには「Community」というメニューが有り、コミュニティを大事にしているという姿勢が明確に見て取れる。


つまるところ、Sketchを選ぶことは、インターネットの集合知、オープンソースの力を信じることでもあるということだ。
私がこの文章を書いているMacのOSだってオープンソースのオペレーティングシステム「Darwin」をベースに作られていて、生活のありとあらゆるところでオープンソースの恩恵を受けている。
かつて百科事典が、オープンソースのWikipediaに置き換えられることで、人々がアクセスできる知識の幅が広がったように。
一つの組織から餌を与えられるように機能が追加されていくのを待ってるのではなく、荒削りなものを自分たちで一緒により良くしていくほうが創造的だし、きっと楽しい。

デザインの道具を選ぶということは、何を信じ、どんな哲学をもってデザインしていくかということと同義なのである。

Popular posts from this blog

午前9時41分、Appleが止めた時間の謎。

ついにiPhone 4Sが発表されました。
日本からは2キャリアから出ることになり、乗り換えるのか、そのままなのか、これまで電波の弱さに悩まされてきたユーザーにとっては悩みどころですね。 

さて、あまり変わり映えのしないiPhone 4Sですが、よくよく見てみると、ひとつ気になることが…。
スクリーンショットの時間が、なんとも中途半端な9時41分になっています。

キリの良い9:40でもなく、イベントの開始時間である10:00でもなく、なぜこんな中途半端な時間なのでしょうか。

気になったので過去の製品画像をみてみると…。 なんと全てが「9:41 AM」で統一されています。
ここまで中途半端な時間で一貫しているということは何か意味があるのかもしれないですね。 ジョブズもしくはMac誕生の時間なのか、Appleにとって何かしらのメモリアルな時間なのでしょうか?
気になって海外のApple系ブログを色々と探索していたら、TUAWの記事に、Secret Labsの開発者ジョン マニングが、アップルストアにいたスコット・フォーストール(Apple上級副社長)に時間の意味を質問したという内容の記事がありました。

それによると、プレゼンテーションでプロダクトを大きくお披露目する時間を、約40分で発生するようにkeynoteをデザインし、スクリーンに映し出されたときに観客の時計とズレがないようにしていたらしいのですが、ピッタリ予定通りに行かない事を見越して数分追加した時間なのだそうです。
この40分に対し、スコットは「secret magic time」と名付けていたそうです。
実際にiPhoneが初めて発表された2007年のMacWorldをみてみたところ、プレゼンが開始されてちょうど40分頃にiPhoneのスクリーンが初めて公開されています。
つまり、時間が統一されている理由は、iPhoneのスクリーンが世界に向けて初めて公開されると予測した時間で、合理的な理由がありつつも、Appleにとって記念すべき時間でもあるからということですね。

さて、無事解決したかと思われますが、ここで新たな疑問がでてきます。
その「secret magic time」はなぜ40分なのかということ。
分刻みのプレゼンテーションを組み立てるぐらいですから、そのタイミングにも意味があると思います。 それ…

細かすぎて伝わりづらい!
iOS 5のデザイン変更点まとめ。

iOS 5のリリースやiCloudの開始、iPhone 4Sの発売と、ここ最近のAppleのプロダクトが一通り出そろった感じですね。
3GSを使っていて常々もっさりしていたので、早速iPhone 4Sに乗り換えたところ、画面の中をスケートをしているかのようにスイスイ動いてくれてとても快適です。
2年前に3GSを使っていたときは、なんて速いんだろうと思っていたわけですが…慣れとは恐ろしいものです。

さて本題ですが、ここ数日使っていた中で気付いた、細かすぎるデザイン変更点があったので前回のLionと同じようにまとめてみました。

 細かすぎるデザイン変更点第2弾、今回も目を凝らしてどうぞ。


 1.アイコンバッジ

 iOS 4のアイコンバッジのシャドウは濃いめのブラックで強めのシャドウになっていましたが、iOS 5ではグレーっぽく明るくなっています。
全体的に比較してみると、iOS 4のシャドウは浮いている感じがするので、明るくなったことで画面全体のトーンにまとまりが出たように感じます。


2.ボックスデザイン

設定画面などのボックスデザインが、iOS 4ではフラットなラインに対して、iOS 5ではシャドウとハイライトが追加されて立体的なデザインになっています。
 iOS全体で同様の立体的なデザインが適用されているので、デザインの一貫性がより高まった感じがしますね。


 3.メッセージのハイライト

これは賛否両論ありそうですが、iOS 4ではメッセージの文字がプレーンなテキストだったのに対して、iOS 5ではハイライトが追加されてこれまた立体的なデザインになっています。
他にも吹き出しの背景色やシャドウが明るくなったことで、背景と文字のコントラストが高くなり、個人的には文字の可読性が高まって良くなったと思います。


 5.回転ロックボタンの厚み

iOS 4では回転ロックボタンのシャドウ距離が3pxだったのに対して、iOS 5ではシャドウ距離が4pxとなって、より立体的に見えるようになっています。
反対にミュージックアイコンのシャドウ距離は3pxで変わらずのままですので、1pxの違いをデザインすることで、回転ロックという機能アイコンと、ミュージックを起動するという起動アイコンの違いを表しているのではないかと思います。


5.ホームアイコンの間隔

 iOS 4ではアイコンの間隔が38pxの等間…

Appleのフォント「Myriad Pro」と「Myriad Pro Web」から読み取るWeb用フォントの秘密。

先日AdobeのCS5をインストールしたら、Macに始めから入っているフォントの「Myriad Pro」の他に「Myriad Pro Web」がインストールされていて「Web? 何か違うの?」と気になりだしたら止まらなかったので調べてみました。

Appleのコーポレートフォントである「Myriad」を解剖していくことでデザインの美しさの秘密に迫ると同時に、Webの冠をつけたフォントはどの様に改良されているのかに迫ってみたいと思います。

まず、始めに「Myriad」とはどんな書体なのでしょうか。Wikipediaで調べてみると…
ミリアド (Myriad) は、サンセリフの欧文書体で、いくつかあるフルティガー体 (Frutiger) 模倣フォントの一つである。アップルやアドビシステムズがコーポレートフォントに採用しているApple、Adobeと、世界のITを牽引する企業が採用しているという事から、先進的なイメージを与えてくれるフォントだということが分かります。

では「Myriad」と「Myriad Web」は、具体的にどこが違うのか、はじめにアウトラインにしたものを重ねてみました。





可読性を高めるために、カウンターを広げたためか、全体的に横長になっている印象を受けます。

その中でも、特に違いが見られたのが大文字の「N」です。


左の「Myriad」のNは直線的に構成されているのに対して、右の「Myriad Web」は中心部が少し膨張気味になっています。

では、どのくらい違うのか、試しに直線を入れて見ると…。

こうして比較してみると、右の「Myriad Web」の方は斜線部に肉付けがされてることが分かります。
何故でしょうか、その理由に迫るために、スクリーン上で実際に多く表示されるであろうサイズへと徐々に縮小してみたいと思います。


視力検査ではありませんよー。

相対的に見てみると、左の「Myriad」は、だんだんと小さくなるにつれて中心部が少し頼りなさそうな感じになり、1番上のものと比較してみると違った印象が感じられます。
反面、右の「Myriad Web」の方は中心部に肉付けしているために、安定した感じがしますが、大きくなるに従って肉付けしている部分に違和感が感じられます。
あちらを立てればこちらが立たず、どちらも一長一短な感じです。

では、「Web」用のフォントとはど…