タグ

2017年6月6日のブックマーク (7件)

  • ブラック企業は少ない!? アンケート結果から分析するイマドキのウェブ制作事情 - ICS MEDIA

    ウェブ業界の当たり前だと思っていることでも、同業他社の人には違う常識があるかもしれません。自分が業界多数の傾向と違うところはどこなのか・・・ この連載ではアンケートデータから国内のウェブ業界の傾向を分析します。 連載第2回目となる記事ではウェブ業界に関する「学習方法」「HTMLのコーディングスタイル」「JavaScriptのコーディングスタイル」「労働時間」「フォント」の5分野のアンケート結果を紹介します。アンケートは筆者のTwitterから実施していたものです。 HTMLCSSを学ぶとき、何で勉強をはじめましたか ウェブ制作の初学者はどのような手段で勉強しているのでしょうか。従来は解説書や会社/学校で学ぶことが多かったと思いますが、最近は動画学習サイトが充実しています。2013年以降に学び始めた方へ質問しました。 208件の回答があり「」が34%、「学校/会社/スクール」が31%、

    ブラック企業は少ない!? アンケート結果から分析するイマドキのウェブ制作事情 - ICS MEDIA
    idr_zz
    idr_zz 2017/06/06
    いろんなアンケート結果まとめ。変数はlet? ICS MEDIA - ブラック企業は少ない!? アンケート結果から分析するイマドキのウェブ制作事情
  • Illustratorを使った5つの簡単なステップで、オリジナルのパターンスウォッチを作成しましょう - 99designs

    装飾的なパターンは、非常に強く視覚に訴えかけるデザインです。有名な芸術作品、建築、消費者向け製品を引き立てる装飾的なパターンは、今日の技術を用いればデジタル処理であっという間に作成することが出来ます。 装飾的なパターンを使えば、布地、カード、ブックカバー、パンフレット、ウェブサイト、iPhoneケース他、いろいろな物の見栄えが良くなり、どんなデザインもちょっと気の利いた感じになります。パターンをストックしておけば便利ですし、ただ単に作るのが楽しいとも言えます。 それでは、Illustratorでオリジナルのパターンスウォッチを作成する5つの簡単なステップを見ていきましょう。 1. ベクター要素を正方形の上に並べる メニューバーの「表示」から「グリッドにスナップ」を選択すると、先ほど描いた正方形がグリッド線にそろいます。正方形のレイヤーをロックすれば、パターンを作っている時にうっかり動かして

    Illustratorを使った5つの簡単なステップで、オリジナルのパターンスウォッチを作成しましょう - 99designs
    idr_zz
    idr_zz 2017/06/06
    クリッピングマスクだとうまくいかず、この方法でうまく作れた!!! Illustratorを使った5つの簡単なステップで、オリジナルのパターンスウォッチを作成しましょう
  • 【完全保存版】シートで簡単チェック!デザイナーが見落としがちなUIデザイン12の想定漏れ | 株式会社LIG(リグ)|DX支援・システム開発・Web制作

    こんにちは。フロントエンドエンジニアのほりでーです。 Webやアプリの開発ではデザイナーとエンジニアの連携が欠かせません。デザイナーとエンジニアが分業する場合、デザイナーがPhotoshopなどのグラフィックツールで完成図となるデザインカンプを作成し、それを元にフロントエンドエンジニアが実装してWebサイトを完成させることが多いでしょう。 しかし、最近のWebサイトで多用されているリキッドレイアウト(横幅の変化に追従するレイアウト)や、ユーザーの操作に反応するインタラクティブなアニメーション表現、CMSやJavaScriptと連動して動作する複雑なUIなどをカンプ上で表現するのは困難です。 そのため、デザイナーが「ここはこういう風に動かしたいな〜」と思っていても、それがエンジニアに伝わっていない、という見落しも発生してしまいます。 一般的に、ソフトウェアの開発では仕様が不安定(=必要な機能

    【完全保存版】シートで簡単チェック!デザイナーが見落としがちなUIデザイン12の想定漏れ | 株式会社LIG(リグ)|DX支援・システム開発・Web制作
    idr_zz
    idr_zz 2017/06/06
    あるあるあるあるあるあるあるあるある... 【完全保存版】シートで簡単チェック!デザイナーが見落としがちなUIデザイン12の想定漏れ | 株式会社LIG
  • ブラウザ戦争は終わった!Webの最先端と未来を、ブラウザエバンジェリストたちが語る

    Web Payments 物江 まず、Web Paymentsについてお聞かせ願いたいのですが、こちら北村さんご説明をお願いできますか? 北村 まず前提として、インターネットを利用する際に私たちがクレジットカードを利用するようになってから、それなりに時間が経過しましたね。そして現在転換期が訪れているといっていいのではないかと思います。これまでのように、フォームにクレジットカードの情報を生で入れて送信するというので、当にいいのだろうか。 そうした問題を解決すべく提案されているのが、Payment Request APIです。他のサードパーティ製アプリに遷移して戻ってくるなどのUIを通じて、決済に必要な情報を、スムーズにユーザーに対して問い合わせることができます。 (筆者注: Payment Request APIの日語による解説記事) (筆者注: よりシンプルな Web の決済方法 :

    ブラウザ戦争は終わった!Webの最先端と未来を、ブラウザエバンジェリストたちが語る
    idr_zz
    idr_zz 2017/06/06
    War is over. If you want it. Ah--Ah--Ah--Ah-- ジョンレノンが祈った世界!!!!! ブラウザ戦争は終わった!Webの最先端と未来を、ブラウザエバンジェリストたちが語る
  • アプリフロントエンジニア必見!UX向上に役立つフローティングアクションボタン(FAB)の使い方

    フローティングアクションボタン(FAB)はAndroidで通常利用されているコントロールボタンで、UI上に浮く丸いアイコンです。非常に効果的なものですが、間違った使い方をしているデザイナーが多いのも事実です。 この記事では以下の疑問に答えます。 ・ FSBはどんな場合に使えば良いか ・ FABのベストプラクティスとは? ・ どのようにFABとアニメーションを組み合わせればUXを向上できるか? FABはどんな場合に使えば良いか? アプリの主要な操作に使う FABはアプリの最も適切な機能のために使用すると良いです。 FABによりユーザーは次に取るべきアクションが分かります。馴染みのない画面では効果的です。 必要な画面にだけ使う FABは目立つものですが、すべての画面に必要なわけではありません。誘導する必要がある場合にのみ使います。 主要なアクションに対してのみ使うようにしないとユーザーの注意を

    アプリフロントエンジニア必見!UX向上に役立つフローティングアクションボタン(FAB)の使い方
    idr_zz
    idr_zz 2017/06/06
    フローティングアクションボタンという名前だったのか 【マテリアルデザインの1つ】フローティングアクションボタンについて解説
  • 【コピペ厳禁!Youtube動画のレスポンシブ埋め込みコード】 - Webサイト専門プログラマの言いたい放題

    Youtube動画のページで共有ボタンを押して 埋め込み用のコードをコピーします。 <iframe width="560" height="315" src="...."></iframe> これをブログやホームページに埋め込むと src="..." で指定された動画がページに表示 されますが、スマホで表示すると横幅が 画面をはみ出したり、縦と横のサイズの バランスが崩れたりします。 上記のタグに、縦横のサイズが固定で 記述されているためです。 そこで、スマホの画面サイズに応じて 縦横のサイズが自動で縮小するように、 スタイルシート(CSS)を使って 上記のタグに記述されたサイズを 「上書き補正」 することができます。 ↓そのテクニックがこちら。 ■HTML <div class="movie-container"> <iframe width="560" height="315" src

    【コピペ厳禁!Youtube動画のレスポンシブ埋め込みコード】 - Webサイト専門プログラマの言いたい放題
    idr_zz
    idr_zz 2017/06/06
    させるかぁ!あえてコピペできないようにして内容を理解させる記事。 【コピペ厳禁!Youtube動画のレスポンシブ埋め込みコード】 - Webサイト専門プログラマの言いたい放題
  • YouTubeの動画の停止時間を指定する方法 - ディレイマニア

    先日「YouTubeの動画を特定の時間から再生させる方法」をご紹介しました。この方法を使えば、動画の好きな場所から再生させることができます。 それと合わせて、「特定の時間で停止させる」という方法も見つけましたのでご紹介します。 YouTubeの動画を途中で止めるためにコードを追記する ではYouTubeの動画の停止時間を指定する方法について、順番に解説していきます。 で、いろいろ試してみたんですけども、動画を埋め込んだ時じゃないとこの方法が使えなかったので、埋め込み用のコードをいじったものを紹介しますね。 まずこちらが、「20秒から開始して、30秒で停止する動画」です。 コードを見るとこんな感じ。iframe内の「src」というのがその動画のURLを表します。このsrcの末尾に「?start=再生開始秒数&end=停止する秒数」と入力してください。 ※下記のコードはiframeのど頭とケツ

    YouTubeの動画の停止時間を指定する方法 - ディレイマニア
    idr_zz
    idr_zz 2017/06/06
    動画の中の一部だけを見せたいときに使えそうなパラメータ YouTubeの動画の停止時間を指定する方法 @delaymaniaさんから