タグ

ブックマーク / webnaut.jp (10)

  • 一緒に仕事したい!と思われるWEBディレクターって?【職種別】好かれるポイント10 | WebNAUT by Beeworks

    WEB制作の現場において、WEBディレクターは、デザイナー、エンジニア、営業など複数の職種から成るチームの中心となって動くことが多いと思います。そんな中でメンバーの能力を引き出すためには、周囲から「このディレクターと一緒に仕事をしたい! 」と思われることって重要ですよね! 今回はビーワークス社内のデザイナー、エンジニア、営業の各職種メンバー(年次も様々)に「こんなディレクターと一緒に仕事したい!」と思うWEBディレクターについて聞いたリアルな声をまとめてご紹介。「チームのパフォーマンスを上げたい!」と思っているWEBディレクターのみなさんに少しでも役立ててもらえればと思います。それではどうぞ! デザイナーが「一緒に仕事したい!」と思うWEBディレクター 1 ディスカッションしやすい環境を作ってくれる 2 "伝える"じゃなく"伝わる"説明をしてくれる 3 デザイナーの意見を、まずは肯定的に受

    一緒に仕事したい!と思われるWEBディレクターって?【職種別】好かれるポイント10 | WebNAUT by Beeworks
  • 縦に長い画像を1枚で印刷する際に自動分割してレイアウトするツール「Print1」 | WebNAUT by Beeworks

    モバイルサイトのデザインデータなど、縦長の画像を自動分割して印刷用に1枚にまとめるツールを作成しました。 データのアップロード等も不要ですので、機密性の高いデータを印刷する場合でも安心して無料でお使いいただけます! 明けましておめでとうございます。年もWebNAUTをよろしくお願い致します。私の新年1目の記事は特に正月らしい内容ではありませんが、Web制作の各場面で使える「痒い所に手が届く」ツールを紹介させていただきます。 デザイン確認時のよくあるやりとり ディレクター: ここでディレクターさんはデザインの確認と指示出しをどのように行うでしょうか? デスクトップ上で修正指示を書き込むようなアプリも幾つかありますが、やはり見やすさや書き込みのしやすさでは紙に印刷して手書きで指示を書く事が多いと思います。 その際、縦に長い画像を印刷しようとすると一般的なアプリではこのようになってしまいます

    縦に長い画像を1枚で印刷する際に自動分割してレイアウトするツール「Print1」 | WebNAUT by Beeworks
  • 【サンプルファイル有】神速に近づきたい!はじめてのPhotoshopオリジナルショートカット設定 | WebNAUT by Beeworks

    ※この記事は2013年5月30日に執筆された記事です。現在では仕様が異なる可能性があります。 こんにちは!デザイナーのタカハマです。今回はデザイン速度を「神速」に近づけるための秘策「Photoshopオリジナルショートカット設定のコツ」をご紹介します。 デフォルトのショートカットだけでは神速には遠い Photoshopには作業効率を高めるためのショートカットが沢山用意されていますが、デフォルトのショートカットだけでは少し物足りない部分もあります。 日頃の業務でよく使うコマンドがあれば、オリジナルショートカットとして、追加しておくことをオススメします。 ささやかな「秘策」ではありますが、チリも積もれば効果は絶大です。 ちなみに、デフォルトショートカットのチートシートはこちらのサイトで紹介されています。 カスタマイズは簡単4step ショートカットは次のやり方で簡単にカスタマイズできます。 「

    【サンプルファイル有】神速に近づきたい!はじめてのPhotoshopオリジナルショートカット設定 | WebNAUT by Beeworks
  • 新人くん、これわかる!?書体の要素が手っ取り早くわかる例え画像 | WebNAUT by Beeworks

    こんにちは!新人デザイナーの入社を今か今かと待ち望んでいるデザイナーのタカハマです。 前回は「定番書体代わりに使えるGoogle Fonts」をご紹介しましたが、今回は「書体の要素」をちょっとした例え話と画像を用いてご紹介します! フォントにも家族がある デザイナーが書体を語る上で、まず知っておきたい言葉「フォントファミリー」 書体の太さ・傾き・字幅が異なっても、書風に一貫性のあるフォント群をまとめて「ファミリー」と言います。 そう、書体にも家族があるんです!次の画像はヘルベチカファミリーの一例です。 そんなフォントファミリーの特徴をWebNAUTにちょこちょこ登場しているキャラクター「ウェブノートくん一族」に例えてご紹介します。 太さ(ウェイト) 同じ書風で太さに変化をつけた書体を用意することをウェイト展開といいます。いわば体重ですね。 シンくんはガリガリタイプで、レギュラー・ブックくん

    新人くん、これわかる!?書体の要素が手っ取り早くわかる例え画像 | WebNAUT by Beeworks
  • アニメーションつきのグラフをカンタンに描画!一度は試してみるべきchart.jsを使ってみた | WebNAUT by Beeworks

    ※この記事は2014年2月12日に執筆された記事です。現在は仕様が異なる可能性があります。 最近データの可視化が流行しているとの噂を聞きつけ、流行りものに乗っかるべくライブラリをあれこれ試しています。その中でも使い勝手がよくドキュメントも分かりやすいChart.jsを使ってWebNAUTのアクセスデータを可視化してみたいと思います。 Chart.jsを使おう シンプルにグラフ描画ツールとして使えるものからリッチでインタラクティブな表現ができるものまで、データ可視化に使えるライブラリが充実してきています。 (恐ろしくカタカナが多いですね) その中で使い方が分かりやすく扱いやすいChart.jsを使いWebNAUTのアクセスデータを可視化し、どのような方々に読んでいただいているのかを推察してみたいと思います。 元データとするのはおおよそ過去1年間の以下の4つの指標です。いずれもGoogle A

    アニメーションつきのグラフをカンタンに描画!一度は試してみるべきchart.jsを使ってみた | WebNAUT by Beeworks
  • 2時間でSassを習得!Sass初心者向け講習スライド大公開! | WebNAUT by Beeworks

    ※この記事は2014年2月4日に執筆された記事です。現在は仕様が異なる可能性があります。 CSSを効率的に書ける言語として昨今話題のSass。 これから導入をお考えの方に向けて2時間でマスターできる初心者向けのSass講習スライドを公開致します。 普段CSSを書く人も書かない人もSassがどういうものかを知る良い機会ですので、是非ご覧ください。 スライドに沿って実践すればSassの基を短時間でマスターできます! この講習では目で見るよりも実際に触れる事で理解が深まるよう、実習スタイルを取っています。 実習に使うファイルセットはこちらからダウンロードして上記のスライドと合わせてお使いください。 https://webnaut.jp/download/markup_140204/sass.zip(3.5MB) Sassの良さを活かすためには、チーム全員がSassを理解することが大切 Sass

    2時間でSassを習得!Sass初心者向け講習スライド大公開! | WebNAUT by Beeworks
  • あなたは見分けられる!?定番フォント代わりに使えるGoogle Fonts 27書体 | WebNAUT by Beeworks

    ※この記事は2014年1月6日に執筆された記事です。現在は内容が異なる可能性があります。 あけましておめでとうございます!定番フォントを愛してやまない、デザイナーのタカハマです。今月からTypeSquareの「MORISAWA PASSPORTプラン」が始まるようで、国内サイトでもWebfontの使用が一気に増えそうですね! そこで今回は、WebNAUTでも使用しているWebfontサービス「Google fonts」から、定番フォントの代わりに使えそうな書体をリストアップしました。 定番フォントをカタチ別にピックアップ 今回は定番フォントの偏りを防ぐために、誠文堂新光社「ABCのみほん〜かたちで見分けるフォントガイド〜」を参考に次のようなカテゴリで分類させて頂きました。 Historical Script 歴史的書体 Serif セリフ書体 Hybrid ハイブリッド書体 Sans Se

    あなたは見分けられる!?定番フォント代わりに使えるGoogle Fonts 27書体 | WebNAUT by Beeworks
  • WebNAUT by Beeworks | デザイン制作会社ビーワークスの情報メディア

    Know-how 日頃クライアントワークを行っているディレクターが、自社コーポレートサイトリニューアルを担当して学んだこと

    WebNAUT by Beeworks | デザイン制作会社ビーワークスの情報メディア
  • 【検証】クリックされるボタンの色は? | WebNAUT by Beeworks

    検証したパターン 調査結果 全アクセスのコンバージョン率(CVR) 結果は下記の通りとなりました。 なんと!緑色がもっともCVRが低いという結果になりました。 どうやら、無条件に「緑色のボタンはクリック率が高い」という結果にはならないようです。 Firefoxをダウンロードしたユーザーと、ビーワークスの採用に応募しようとしたユーザーには、何か違いがあったのでしょうか? 「どこから流入したか」によって結果に違いがあった 調査対象ページにアクセスしたユーザーは、何かきっかけがあって、ビーワークスの採用に興味を持ってアクセスしているはずです。そこで、どこから流入したのか、「参照元」のセグメント別に結果を分けて分析してみます。 こうやってセグメント別に分けてみると、参照元によってCVRの平均値自体に大きな差があることがわかります。CVR順に並べると、検索 > WebNAUT > なめぱら という結

    【検証】クリックされるボタンの色は? | WebNAUT by Beeworks
  • 感覚派デザイナーも知っておいて損はない「デザインの要素と原則」 | WebNAUT

    「あなたは感覚派デザイナー?それとも理論派デザイナー?」 このような質問をされると、理論派デザイナーだと答えたくなる理系出身デザイナーのタカハマです、こんにちは。 今回は、そんな理屈っぽい私の大好物である「デザインの要素と原則」をご紹介したいと思います。理論派デザイナーの方はもちろん、感覚派デザイナーの方も知っておいて損はないですよ! 「デザインの要素と原則」はビジュアルデザイン全般に活用できる Webデザインに限らず、ビジュアルデザインの基礎を学ぶ上で、大変参考になる「デザインの原則」というものがあります。いわゆる「Design elements and principles(デザインの要素と原則)」や「Gestalt principles(ゲシュタルト原則)と言われる原則で、デザインの構成要素や要素同士の関係性が全体に与える影響をまとめたものになります。 調べてみると識者によって分類や

    感覚派デザイナーも知っておいて損はない「デザインの要素と原則」 | WebNAUT
  • 1