CSSで簡単な三角形を作るコツ！
皆さん
技術担当のレミです。
CSSで、どうやって正方形が作れるのだろうか？
> それは、簡単ですよ！あらゆるHTMLエレメントは正方形・長方形が基本ですから。。
ただし、三角形はどうでしょう？
あなたならそれをどうやってそれをCSSで実現しますか？
この記事では、CSSで簡単に三角形を作るためのコツを教えます。
design
Sketchからの画像パーツ出力を検証する
こんにちは。
フェノメナエンターテインメント デザイン担当の山男です。
最近は画面デザインの指示にSketchを用いる機会が増えて、それに伴い画像パーツもSketchから書き出すことが多くなってきています。
ベクターデータで１サイズ作成しておけば、あとは必要なサイズに一瞬で展開出来るので便利ですが、出力された画像パーツは信頼できるのか？という不安も残ります。
チェックポイントは色々ありますが、今回はその中から幾つかピックアップして検証してみようと思います。
美しいUDフォント
マツキヨです。
とあるきっかけでUDフォントについて学んでみました。
ET2017(組込み総合機器展)で実施したアンケート調査もその一環です。
「UDフォントの可読性」
今まで、組込み機器の画面デザインでクライアントからフォントの助言を求められると次のように回答していました。
「きちんと購入費が計上できるならUDフォントを使うとよいですよ」
「費用はイワタ、モリサワ、モトヤ、フォントワークス…フォント販売各社にお問い合わせしてください」
「購入費を確保できない場合は、無償のIPAフォントというのがあるので調べてください」
そして、深く考えずに「できるだけUDフォントにすべきです」と進言していました。
IllustratorでUIデザインをする時に行う基本的な設定7つ
こんにちは。フェノメナエンターテインメント・デザインチームのトウミヤです。
UIデザインを作成する時に使うソフトウェアというと、現在はPhotoshopやSketch、XD辺りが主流になっています。しかし、Illustratorもオブジェクトの全てをベクターデータで処理し、拡大縮小や色の変更が容易なこともあり、UIデザインに十分活用できると考えています。
ただ、ベクターデータはPhotoshop等で作成されるビットマップデータと違い、そのまま描画するとオブジェクトに「にじみ」が発生しやすくなります。それを回避するためには、IllustratorにUIデザイン用の設定を施す必要があります。最近の業務でIllustratorを使って画面をデザインする機会があったため、その際に私が設定した事項について備忘を兼ねて書くことにしました。
「ＥＴ２０１７（組込み総合技術展）」に出展し、調査を実施しました
１１月１５日から１７日まで、パシフィコ横浜で開催された「Embedded Technology 2017（組込み総合技術展）」に出展し、弊社ブースでＵＩに関するユーザーテスト的なアンケート調査を実施しました。
「Embedded Technology 2017（組込み総合技術展）」 出展風景
「にじみ」のないアイコンの作り方
こんにちは。フェノメナエンターテインメント・デザインチームの新人、トウミヤです。
皆さんは「見やすいアイコンの条件」というと、どのような条件を思い浮かべるでしょうか。
「視認性の高い配色になっている」「画面のサイズに対して適切な大きさになっている」…これらももちろん重要な条件ですが、私は「にじんでおらず、はっきりしている」という条件も挙げられると考えています。
「にじみ」とは
ここでは100％表示の時点で図形がクリアに見えておらず、少しぼやけている状態のことを指しています。
「にじみ」は画面全体を囲む線など、大きなデザインの場合は影響は少ないですが、アイコンなど小さなデザインの場合は影響は大きく、クオリティの高低に繋がります。
また、アイコンに「にじみ」が多いと、ユーザーにとってやや認識しづらいアイコンになってしまうので、UXの質に影響を及ぼすことも考えられます。
左がにじんでいるアイコン、右がにじんでいないアイコン
では、「にじみ」のないアイコンはどのように作れるのか。
以下で私なりの手順を紹介します。
アイコンタッチについて
フェノメナエンターテインメント デザインチームのニキです。
今回はアイコンタッチについてです。
アイコンタッチとはアイコンのテイストのことです。
大量にアイコンを作成する場合にアイコンタッチを決めると、土台となるルールが決まるのでスムーズに作業が進むと思います。
決めておくことは様々あると思いますが、私が特に重要だと思っていることが2つあります。
フェノメナワークショップ in 八丈島
こんにちは。
フェノメナエンターテインメント デザイン担当の山男です。
日頃から同じ部屋でデザイナーとプログラマーが顔を突き合わせて作業しているフェノメナですが、全員が揃って１つのテーマで議論できる場は、ちょっと強引にでもセッティングしないと案外実現しません。
今どういったテーマに取り組んでいるのか、気になっているトピックはあるかなど、各人で気が向いたときに共有する／されることはありますが、それを一堂に会してとことん突き詰めてみよう！というのは、意識的にアクションしないと機会が訪れないままに日々が流れていってしまいます。
Windowsフォームにおけるフォント指定
こんにちは。
フェノメナエンターテインメント デザイン担当の山男です。
Windows 8.1から「游書体」が標準搭載されるようになり、自宅でもオフィスでもWindows 10環境の私などは、メイリオ (Meiryo UI) よりも游ゴシック (Yu Gothic UI) を見ている時間の方が多くなりました。
どちらの方が綺麗に見えるか？というのは、今もって意見が分かれるところですが、新しいOSで游ゴシックがシステムフォントに採用されている状況を考えると、否が応にもそれに合わせていかざるを得ない気はしています。
このブログから情報発信しているUIデザイン専門家集団のホームページ :
フェノメナエンターテインメント株式会社