タグ

ブックマーク / uxmilk.jp (7)

  • 【scp】Linuxでリモート・ローカル間でファイルを転送するコマンド | UX MILK

    Linuxでローカルホストとリモートホスト間でファイルを転送する場合は、scpコマンドを使います。scpコマンドはSSHプロトコルを使用します。そのため、ネットワーク通信は暗号化されるので、安全にファイルの転送を行うことができます。 scpコマンドの使い方 scpコマンドの構文は以下の通りです。

  • 有名サイトの事例から学ぶ12のWebデザイン・レイアウト

    ユーザーはデザインを見たいのではなく、コンテンツを求めてサイトにアクセスします。Web UI Patterns 2016 Vol. 1で説明した通り、デザインは直感的で分かりやすくコンテンツを表示するための手段にすぎません。 この記事では、Webにおける12通りのレイアウトのパターンを実際の例や良い実践方法、共通のシナリオを通して見ていきます。 1. カード 2. グリッド 3. マガジン 4. コンテナの不使用 5. スクリーン分割 6. シングルページアプリケーション(SPA) 7. Fパターン 8. Zパターン 9. 水平的なシンメトリー 10. 水平的なほぼシンメトリー 11. 放射線状のシンメトリー 12. アシンメトリー 1. カード

    有名サイトの事例から学ぶ12のWebデザイン・レイアウト
  • Webサイトのプロジェクトを上手にキックオフする方法

    RobertはGatherContentのコンテンツストラテジストです。 また、GatherContentブログの編集長でもあり、さまざまなWebマガジンで記事を書いています。彼のTwitterはこちら。 Webサイトプロジェクトのスタート時には、ローンチを成功させるために、プロジェクトのゴールを理解し、ユーザーと顧客について学ぶ発見フェーズが必要です。さらに、発見フェーズを進めるためのキックオフミーティングも同じように重要です。 受託制作と自社サービスのどちらの場合でも、キックオフミーティングと発見フェーズにおいてチームが協力し合うことで、組織の目的を共有することができます。これらの段階は、プロジェクトを上手く協力しながら進めるために、チームを立ち上げる段階でもあります。 いつキックオフミーティングをすべきか 理想的にはキックオフミーティングは、プロジェクトへの期待を共有するために、プロ

    Webサイトのプロジェクトを上手にキックオフする方法
  • 相手を説得するときにデザイナーがやってはいけない8つのこと

    Paul BoagはUXデザイナーでデジタルトランスフォーメーションのエキスパート。非営利団体がWeb、ソーシャルメディア、モバイルを利用する支援をしている。 私たちは仕事をするために、クライアントとステークホルダーを納得させる必要があります。彼らがいないと、私たちは必要なことをするための承認を得ることができません。しかし、私たちのほとんどは説得するのが驚くほど下手です。よって問題は、私たちがどのように説得に失敗するのか、それについてどのように対処するべきかです。 私は、6月末のオンラインワークショップの準備にあたり、クライアントやステークホルダーとどのように協力して仕事するのかについて、多くのことを考えました。これは、同僚やクライアントから同意を得る方法について4つのパートから説明するものです。 私がこのようなワークショップを開くのは、ほとんどすべての作業において、やる価値があると他人を

    相手を説得するときにデザイナーがやってはいけない8つのこと
  • HTMLとCSSのコピペですぐに実装できる見出しデザイン14選

    WEB制作で必ずと言っていいほど登場するものの1つに「見出し」があります。 そこで今回は、CSSだけで作られている見出しの中でも、実用性が高いものやCSSの最新要素を使ったものを厳選してご紹介します。コピペで簡単に実装できるので、是非使ってみてください。 飾り付きの見出し 擬似要素before、afterを使って飾りをつける見出しです。beforeとafterのcontentプロパティを変更すれば、☆や♡にすることもできます。 同じくbefore、afterを使うパターンです。transformプロパティで斜めにした長方形と長方形を重ねることで三角形を作っています。 beforeとafterを使ったシンプルな見出しです。ボーダーを指定した擬似要素の位置をpositionプロパティで指定しています。 ボーダーがある見出し キャプション付きの見出しです。シンプルなので使いやすいですが、レスポン

    HTMLとCSSのコピペですぐに実装できる見出しデザイン14選
  • 複雑なコードは不要!簡単に使えるHTML/CSSジェネレーター22選

    今回はWeb制作で役立つHTML/CSSを生成してくれるジェネレーターを紹介します。 CSS3の登場でより高度なアニメーションや表現ができるようになりました。一方、CSS3のコードは複雑になりがちでプロパティの使い方を覚えるのも大変です。 ジェネレーターはリアルタイムでデザインを確認できたり、GUIで簡単にデザインを調整できたりします。より効率的なWeb制作を行うために、ぜひ活用してみてください。 WAIT! Animate http://waitanimate.eggbox.io/#/ CSSのループアニメーションで遅延を挿入するのは簡単ではありません。こちらのサービスでは一時停止機能をもったループアニメーションのコードを生成してくれます。いくつかの主要なアニメーションのテンプレートが提供されており、さらにカスタマイズも可能です。 Stylie http://jeremyckahn.gi

    複雑なコードは不要!簡単に使えるHTML/CSSジェネレーター22選
  • Webデザインが圧倒的に捗るGoogle Chromeの拡張機能12選

    みなさんはChrome拡張機能を活用していますか? 拡張機能を使えば面倒な作業でも効率良くこなすことができます。今回はWebデザインのときに使うと仕事が圧倒的に捗るChrome拡張機能を紹介します。 1. FireShot ダウンロードURL:FireShot ページのキャプチャを撮影できる拡張機能です。ページ全体をキャプチャ、目に見える部分をキャプチャ、選択してキャプチャすることができます。ランディングページなど縦長のページのスクリーンショットを撮影するときに便利です。 2. PerfectPixel by WellDoneCode ダウンロードURL:PerfectPixel by WellDoneCode ページ内に任意の画像を重ねることができる拡張機能です。画像を動かしたり、透過させたり、サイズを変更したりしてレイアウトすることができます。ボタンやロゴの配置を迷っているときにコ

    Webデザインが圧倒的に捗るGoogle Chromeの拡張機能12選
  • 1