タグ

ブックマーク / baigie.me (7)

  • 【2024年6月版】ベイジの業務システムUIデザインワークフロー(100のタスクを徹底解説) | ベイジのUIラボ~業務システムとSaaSのUIを考える

    ベイジは2010年の創業以来、ウェブ制作事業を中心に事業を展開してきました。この事業では、サービスの質を統一するために2014年頃からワークフローの整備に取り組んできました。 一方ウェブアプリデザイン事業については、事業拡大したのがここ数年で、まだワークフローが整備されておらず、各人の裁量に委ねた進め方になっていました。そこで今後の事業拡大とメンバー増員を想定し作成したのが、業務システムやSaaSのUIデザインに特化した「ベイジの業務システムUIデザインワークフロー」です。 基的な進め方は国際規格(ISO 9241-210※)の人間中心設計プロセスに基づいて組み立てていますが、細かいタスクの順序や内容は、今までベイジで培ってきたノウハウをふんだんに盛り込み、組み換えています。 そして、様々なプロジェクトでこのワークフローを実用しながら、今もアップデートを続けています。 また今回のワークフ

    【2024年6月版】ベイジの業務システムUIデザインワークフロー(100のタスクを徹底解説) | ベイジのUIラボ~業務システムとSaaSのUIを考える
  • 管理画面のUIデザインにおける20の改善ポイント | ベイジのUIラボ~業務システムとSaaSのUIを考える

    私たちの日常業務で使われる管理画面は、大量の情報と複雑な機能で構成され、利用難易度が高い傾向にあります。検索性の乏しい管理画面の一覧から1つの情報を見つけるために、どれだけの時間を費やしているでしょうか。 1億円の工数をかけて開発した機能も、低品質なデザインでは、機能の存在に気付かれなかったり、間違って使われたりと、期待した業務コストの削減に繋がりません。これでは、1億円を捨てたようなものです。 使い勝手の良くないデザインは、ユーザーだけではなく、開発者にも悪い影響を及ぼします。複雑な構造と分かりにくい操作体系の管理画面は、開発やテストの手間を増やし、その後の機能拡張も難しく、改修コストも増大します。 これらのリスクを抑えるためには、UIデザインの基原則を理解し、適切に管理画面を設計することが重要です。 私たちは管理画面のUIデザインの改善やリニューアルを手掛けることも多いのですが、その

  • ベイジのweb制作ワークフロー2018(140のタスクと解説) | ベイジの社長ブログ

    ベイジで社内のワークフローを整理しだしたのは確か2014年頃です。その頃はまだ4~5人しか社員がいない状態で、タスクの粒度も粗く、いくつかのタスクは各人の能力に委ねたものでした。しかし10人を超えて関わる人が増えたあたりから、仕事の進め方も徐々に変わり、ワークフローの綻びも色々と出始めてきました。そこで今年の春に、全社員参加のもと、これまでの進め方の問題点を話し合ったうえで、ワークフローの大幅な刷新を行いました。エントリーはそのご紹介です。 刷新にあたって、受注から納品までをサブタスクを含めて約140に分解しました。また、各タスクで用いられるドキュメントもできるだけフォーマット化し、効率よくドキュメントワークができるようにしました。 合わせて、タスク毎の職能の再定義を行いました。プロデューサー、ディレクターといった業務範囲が曖昧な職能は、より厳密な職能の定義を試みました。例えばディレクタ

    ベイジのweb制作ワークフロー2018(140のタスクと解説) | ベイジの社長ブログ
  • Webデザインの没個性化と認知容易性 | ベイジの社長ブログ

    Webサイトのデザインは紙のデザインと異なり、技術的な制約が強く、特に最近は様々な環境(デバイス、ブラウザ、画面サイズ、屋内・屋外など)での閲覧に対応できることを求められます。そのため、戦略から要件、コンテンツ、機能と論理的にデザインを決めていくと、どこかで見たことあるような没個性なデザインになりやすいものです。(注:ここでいうデザインは視覚的なデザインを指します) マルチデバイス、マルチブラウザが進み、レスポンシブWebも選択肢の一つとして一般化した昨今では、Webデザインの没個性化はますます進んだ印象があります。例えば、Googleが公開しているマテリアルデザインのガイドラインを見ても、デザインのパターン化と属人性排除の思想を如実に感じることができます。また、データドリヴンなサイト改善を積極的に行っていくと、「デザインの個性」と成果に大した因果関係がないことを痛感します。 没個性なデザ

    Webデザインの没個性化と認知容易性 | ベイジの社長ブログ
  • UIデザインにおけるナビゲーションのデザインパターンまとめ | ベイジの社長ブログ

    前回エントリーでは「UIデザイナーが理解しておくべき11種類のナビゲーションと特徴」として、ナビゲーションの種類を、機能的な側面から分類し、ご紹介しました。 続編となる今回は、ナビゲーションをデザイン的な側面からとらえ、形状、ふるまい(動き)、階層というの3種類の表現軸に分けて、ナビゲーションでよく使われているデザインというものを整理してみました。 形状のデザイン UIにおけるナビゲーション要素が、主にどのような形状でデザインされているか、というパターンをここではご紹介しています。 メニューバー メニューをボタン化し、バー状にまとめたデザインです。PCサイトのグローバルナビゲーションやローカルナビゲーションなどによく採用されます。 一覧性に優れ、一目でナビゲーション要素と分かるため、ユーザビリティに優れます。一方、ある程度の表示スペースを必要とするため、スマートフォンではあまり用いられない

    UIデザインにおけるナビゲーションのデザインパターンまとめ | ベイジの社長ブログ
  • Web制作をやってて、老後を安心して過ごせる貯蓄ができるのか? | ベイジの社長ブログ

    年始の社内打ち合わせで、会社の目標と各自の人生計画は繋がっているべきだ、という話をみんなで行いました。その中で特にこのテーマについて盛り上がったので、ブログにまとめてみました。 老後に必要なお金と年金について考えてみる あなたは、いくら貯金があれば、安心して老後を暮らせますか? 私はファイナンシャルプランナーではないので、詳細は各自お調べていただくとして、様々な話をざっと総合すると、以下のような試算にまとめられます。条件としては、60歳で引退し、60歳から85歳まで夫婦で生きると仮定し、子育ては終わってて、家は持っている(ローンの返済は終わっている)場合です。 なんだか、思ったよりたくさん貯金していないと厳しそうですね。しかし安心してください。わが国には年金という制度があります。年金の受給額は人によって異なるので詳細はこちらも各自お調べいただくとして、現行制度を元に少し多めに、だいたい各自

    Web制作をやってて、老後を安心して過ごせる貯蓄ができるのか? | ベイジの社長ブログ
  • スマートフォン用サイトで動画を扱う時のポイント | ベイジの社長ブログ

    最近スマートフォン用サイトの引き合いが増えてきていますが、そこで培ったノウハウもこのブログで紹介していこうと思います。今回は、スマートフォン(およびタブレット)用サイトでの動画の取り扱いについて。 スマートフォンで動画というと、真っ先に思いつくのはYoutubeにアップしてリンクを張り付ける方法ですが、企業の内規や動画の性質によっては、Youtube上に動画をアップすることができない場合もあります。先日担当したキャンペーンサイトもまさにそうでした。というわけで、ここではYoutube貼り付けじゃない方法での、スマートフォン/タブレット端末用サイトで動画を掲載する際のポイントをご紹介します。違ってるところがあればコメントでご指摘いただけると幸いです。 ちなみに、プラットフォームやOS毎の実装状況をひとまずまとめると以下の通り。なお、スマートフォン/タブレット版はデフォルトブラウザでの利用が前

    スマートフォン用サイトで動画を扱う時のポイント | ベイジの社長ブログ
  • 1