nanami

株式会社Rabeeでデザイナーをしています。 前職はメーカー営業職。好きなものは登山と…

nanami

株式会社Rabeeでデザイナーをしています。 前職はメーカー営業職。好きなものは登山とクラフトビールです。
  • 固定された記事

「料金比較表」のUIを集めてみた｜パーツ別デザインまとめ

こんにちは！株式会社Rabeeでデザイナーをしています、nanamiです🌿 今回はLPやサービスサイトでよく見かける「料金比較表」のUIパーツに特化してデザインを集めてみました。 LPや特定のサービスサイトは構成要素が比較的パターン化されています。 「この要素・セクションのデザインどうしよう」となった時用に、要素ごとにデザインのパターンのストックを持っておきたい。 そんな皆さまに参考にしていただけると嬉しいです！ はじめに今回は、集めた料金比較表のデザインをこちらのサ

nanami

    • 「ステップ・フロー」のUIを集めてみた｜パーツ別デザインまとめ

      こんにちは！株式会社Rabeeでデザイナーをしています、nanamiです。 今回は、LPや提案資料などでよく使用されるデザインパーツ「ステップ・フロー」のUIを集めてみました。 はじめに「ご利用の流れ」や「お申込の流れ」など、時系列に並んだ項目をわかりやすく可視化する手段として用いられるステップ・フローのセクションは、サービスやプロダクトを訴求するLPや提案資料にかかせない存在です。 今回はそのステップの整列パターン別に、PC・SPでどのようにレスポンシブされるのか？と

      nanami

      • Webデザイナーが「サービス紹介動画」を構造分析してみた（8事例）

        こんにちは！株式会社Rabeeでデザイナーをしています、nanamiです。 最近、プロダクトやサービスの内容を紹介する手段として、イラストやモーショングラフィックなどを用いた動画が使用されているのをよく見かけます。 そこで今回は、サービスの内容を1~2分でまとめたサービス紹介動画を複数ピックアップし、その構造を分析してみることにしました。 はじめに本記事を書くに至った経緯 私は現在、映像のデジタル合成やモーショングラフィックの制作などができるAdobeのソフト“Aft

        nanami

        • 「CTAボタン」のUIを集めてみた｜パーツ別デザインまとめ

          こんにちは！株式会社Rabeeでデザイナーをしています、nanamiです。 今回は、LPにおいてCV（コンバージョン）に大きく影響を与えるUIパーツ「CTAボタン」周りのデザインをパターン別に集めてみました。 はじめに前回の記事で予告をした通り、今後、LPやWebサイトを構成する様々な要素を１つずつ特化して調査をしていきたいと思っています。 今回はその「パーツ別デザインまとめ」シリーズ２本目です。 ↑ こちらの記事、たくさんの方に読んでいただけており嬉しいです！ パタ

          nanami
        • 固定された記事

        「料金比較表」のUIを集めてみた｜パーツ別デザインまとめ

        nanami

        • 「ステップ・フロー」のUIを集めてみた｜パーツ別デザインまとめ

          nanami

        • Webデザイナーが「サービス紹介動画」を構造分析してみた（8事例）

          nanami

        • 「CTAボタン」のUIを集めてみた｜パーツ別デザインまとめ

          nanami

          Figma新機能｜マルチ編集機能の概要と使いどころ

          こんにちは！株式会社Rabeeでデザイナーをしています、nanamiです🌿 今回は、日本時間の今日（2024.3.7）発表されたばかりのFigma新機能、マルチ編集機能について、その機能概要や使いどころを公式解説をもとにまとめました。 はじめに現在、Figma Community上ではこちらの公式解説が公開されています。 Figmaの公式解説は、実際に手を動かしてみる用の作業場も準備されていて作りが丁寧なので、こちらを読めば内容は理解できるのですが、この機能に関わらず、

          nanami

          Figma新機能｜マルチ編集機能の概要と使いどころ

          nanami

          社内勉強会｜キーワード別にWebデザインの特徴を分析する

          こんにちは！株式会社Rabeeでデザイナーをしています、nanamiです。 私たちのデザインチームでは、週に一回、各メンバーが交代で題材を持ち寄り、社内勉強会を実施しています。 今回は、デザインのイメージを表現するキーワード別に分類されたWebデザインを見て、デザイン上の特徴を分析しワイワイ話し合ってみる会！をやってみたので、その進め方や学んだことを共有したいと思います🌿 個人でも、チームでもできるワークなので、デザイナーの皆様の参考になると嬉しいです！ 勉強会を設定

          nanami

          社内勉強会｜キーワード別にWebデザインの特徴を分析する

          nanami

          ミーティングが上手な人を観察して見えてきた、12個の共通点

          はじめに「『デザインはセンスじゃない、知識の蓄積だ！』ってよく言うけど、ミーティングも上手な人の真似をすれば上手くなるのでは？」と思い、上手な人を観察して見えてきた共通点をリストアップしてみることにしました。 「ミーティングのやり方」なんて学校で教えてもらった覚えはないのに、仕事となると何かと発生するミーティングの機会。苦手意識を持つ方も多いのではないでしょうか？ そんなみなさまに、私の周りのデキる人たちの特徴を共有したいと思います。 ミーティングが上手な人の特徴そもそも

          nanami

          ミーティングが上手な人を観察して見えてきた、12個の共通点

          nanami

          デザイナーのためのインフォグラフィック入門

          こんにちは！デザイナーのnanamiです。 現在、Web制作会社のデザインチームに所属しています。 今回は、自社のコーポレートサイトの採用ページを盛り上げよう！というプロジェクトの過程で使用したインフォグラフィックに関する学びを書き留めたいと思います✍️ 「誰でも分かるように」って難しいデザイナーという仕事をしていると直面するこの問題。Webサイトでも、バナーでも「誰が見ても瞬時に分かる」ということを一つの指標としてデザインをすることが多いです。 そこで、情報を分かりや

          nanami

          デザイナーのためのインフォグラフィック入門

          nanami