デザインに興味があるエンジニア向けのTips10選 - Qiita
Qiita株式会社 Advent Calendar 2021（2）の20日目の担当は、CX向上グループの@xrxoxcxoxです！ この記事の概要 タイトルの通り、デザインに興味があるエンジニア向けのTipsをいくつかまとめてみました。 「自分はセンスがないからデザインは無理ですよ……」と仰る方が多いような気がしたので、持って生まれた感覚ではなくて理屈で良い感じにするためのあれこれを書き連ねてみました。 かつて社内向け勉強会で作った資料を記事化しているので一部記事に最適化できていない箇所もありますがご了承ください 色の選び方 UIやロゴ作る上で、テーマカラーを選ぶときは以下のあたりを確認しながら進める 商材やモチーフの印象にあっている 社会的な文脈に沿っている 明度や彩度がUI的に都合が良い アクセシビリティが高い 商材やモチーフの印象にあっている 例：水を扱うサービスのイラスト 茶色 青
デザインの参考になる！落ち着いたカラースキームが使われているページレイアウトやUIのPSD素材のまとめ
サークルやダイヤモンドのエレメント、半透明のパネル、ソリッドなライン、同一色相のグラデーションなど、最近のWebトレンドを使い細部までしっかりと作り込まれたコーポレートサイト、ポートフォリオ、ランディングページなどのページレイアウトやUIキットが揃ったPSD素材を紹介します。
Motion Blur
Motion blur is the artefact by which fast-moving objects appear blurred. It's been present in movies, photographs and video games for many years now. I haven't seen it used in any real-world user interfaces yet, though some designers have utilized it in prototypes, for example YW_Z in his Pocket animation: I'm not sure I'd like to see this effect used in every animation, but I think it could bring
StoryBoard+AutoLayout Bad Knowhow
iphone_dev_jp 東京 feat. Ben Zottoの発表資料です
ScaleOut | Supership
2024年4月1日より、Supership株式会社は親会社であるSupershipホールディングス株式会社に吸収合併されました。 合併に伴い、存続会社であるSupershipホールディングスは社名をSupershipに変更し、新たな経営体制を発足しました。本件に関する詳細は、プレスリリースをご確認ください。 2024年4月1日より、Supership株式会社は親会社であるSupershipホールディングス株式会社に吸収合併されました。 合併に伴い、存続会社であるSupershipホールディングスは社名をSupershipに変更し、新たな経営体制を発足しました。 本件に関する詳細は、プレスリリースをご確認ください。
開発者向け！iPhone用アプリ開発をする上で知っておくべき各種UIの要素サイズやピクセル数をまとめた画像 | ゴリミー
【img via Lab time. Students were developing their mobile apps. by Shemp65】 仕事で必要になったので、ちょこっとメモ。 画面の解像度は分かるが、ナビゲーションバーに置くアイコンやタブバーに置くアイコンのサイズは把握しているだろうか。 iPhoneアプリを作る上でネイティブで用意されている各UIの要素サイズやピクセル数がまとめてあるiPhone Development 101の記事にたどり着いたので、紹介する！ Appleが用意してくれたUIを利用するなら見ておくべし！ 過去に各iOSデバイスの情報をまとめた「iOS Design Cheat Sheet」を紹介しているが、あくまでも各要素の名前を知っている前提なので、アプリ開発初心者には優しくない。 アプリ開発者は要チェック！アイコンサイズやデザイン要素など、各iOSデ
【Objective-C】iPhone5（4インチ）のサイズ判別など、画面サイズの取得にはUIScreenが便利 - しすぜろ
今までiPad未対応のアプリのみを作っていたので、あまり縁のなかった、解像度にあわせた表示内容の変更。ただ、iPhone 5が発売され、新解像度である4インチの出現によってそうは言っていられなくなりました。 これから出る4インチのiPod touchにも備え、ディスプレイのサイズを判別する方法を調べてみると、UIScreenクラスの使い方がとっても簡単で、便利そうです。 使い方は簡単でUIScreen > mainScreen > bounds の size で、スクリーンのサイズを引っ張ってきます。4インチだと320x568になるので、そこで判別します。ユニバーサルアプリではなければ、それ以外を3.5インチとしておけば良いでしょう。 参考: UIScreen Class Reference CGSize screenSize = [[UIScreen mainScreen] bounds
UIView拡張カテゴリによるUIコーディングの簡略化 - mixi engineer blog
はじめまして、佐野です。僕は2006年10月にメンバー4人でネイキッドテクノロジー社を創業し、5年間ガラケーからスマホに渡るまでモバイル関連の技術・サービス開発に携わり、去年の10月にミクシィ社にジョインし、現在はmixiのiPhoneアプリの開発に携わっております。このブログではiOSプログラミングの初級者～中級者向けに、さらなる上達の助けになるようなことを書いていきたいと思います。 Apple 製の iOS/Mac アプリの統合開発環境であるXCodeは、ver4 から GUI ベースの UI 開発ツールである Interface Builder が組み込まれ、非常に快適にUI開発ができるようになりました。mixi の iPhone/iPad アプリも基本的には各画面が IB ファイルで構成されています。静的な画面であればこれだけで済むのですが、アニメーションを多用したインタラクティブ
iOS 5からのUIActivityIndicatorViewの変更 - もっと、みやびちゃんぷりちー！
iOS 5からUIActivityIndicatorViewのサイズ指定で変更があったようです。 UIActivityIndicatorViewStyleでactivityIndicatorViewStyleを設定した際は以下のサイトで書かれている通りのサイズで従来と変わりません。 Good night, Posterous UIActivityIndicatorViewStyleWhite: 21x21 px UIActivityIndicatorViewStyleGray: 21x21 px UIActivityIndicatorViewStyleWhiteLarge: 36x36 px 但し、上記以外で任意のサイズにする際、iOS 4までは以下のようなコードで良かったのですが、 UIActivityIndicatorView* indicator = [[UIActivityIndi
jQuery UI モーダルダイアログの仕組み - てっく煮ブログ
JavaScriptjQuery UI の Dialog 機能はダイアログをモーダル表示することができる。サンプルを見ると、背景がグレーアウトされて、手前のダイアログしか操作できないTab キーを動かしてもダイアログからフォーカスを移せないといった動作になっている。いままでいろんなライブラリの擬似モーダル実装を見てきたが、Tab キーを押したらこっそり裏側の部分にフォーカスを移せるものばかりだったので、Tab キーにちゃんと対処していたところに驚いた。どうやって実装してるんだろうと思って jquery.ui.dialog.js を見てみたら、次のように泥臭く実装していた。 // prevent tabbing out of modal dialogs if (options.modal) { uiDialog.bind('keypress.ui-dialog', function(even
フォームの入力内容にツールチップ表示をするJavaScriptライブラリ「Tooltip for forms」:phpspot開発日誌
フォームの入力内容にツールチップ表示をするJavaScriptライブラリ「Tooltip for forms」 2006年10月22日- Tooltip for forms You can download the entire script from this Zip file フォームの入力内容にツールチップ表示をするJavaScriptライブラリ「Tooltip for forms」。 このライブラリを利用すれば、次の画像のようなツールヒントをフォーム上に出すことが可能です。 実装は、必要なライブラリを読み込んだ後、次のように、tooltipText 属性にヒントを書きます。 <input type="text" id="firstname" name="firstname" tooltipText="Type in your firstname in this box"> そして、
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Photoshop Tutorial For Developers: Creating a Custom UISlider
IDEA * IDEA
JavaScript++かも日記 - 1997年からの