無料から試せるカスタマーサポートツール｜Tayori（タヨリ）スマートキャンプ株式会社主催 ※1「BOXIL SaaS AWARD 2024」BOXIL SaaSセクションメール共有・問合せ管理システム部門｜※2「BOXIL SaaS AWARD Spring 2024」メール共有・問合せ管理システム部門で受賞 ※3 ITreview Grid Award 2023 Summer「フォーム作成部門/ FAQシステム部門/ アンケート作成部門」で受賞
登録フォームのテキストフィールドにはオフホワイトを
アプリケーションをデザインする際、ほとんどのデザイナーはコンテンツページには労力を費やしますが、登録フォームは見過ごしがちです。ユーザーが辿り着くのは、視覚的に魅力がなく、無味で事務的なフォームです。白いバックグラウンド、まっさらなテキストフィールド、煩雑な文章、不快な黒のアウトラインがあちこちに散らばった、登録のモチベーションを掻き立てないフォームです。もしあなたのフォームがそんな状態であれば、改善の余地ありです。 あなたのアプリを使いたいユーザーはフォームの見た目に関わらず登録はしてくれるでしょう。しかし、まだ決めかねているユーザーは事務的なフォームを見て辞めてしまうでしょう。第一印象で多くの見込み顧客を失っている可能性があるということです。もっと機能的で魅力的なフォームにすることで、ギリギリで決めかねているユーザーの背中を押すことができます。 ビジュアルがユーザーを後押しする ある調
日付・時間のピッカーを単独のWebコンポーネントとして利用できる軽量JavaScript -Aeon Date Picker
デスクトップでもスマホでもタブレットでも動作し、フレームワークの有無に関係なく機能する、日付・時間のピッカーを簡単に実装できるわずか5Kbの軽量JavaScriptを紹介します。 依存関係は一切なく、単独のWebコンポーネントとして利用できるので、非常に便利です。日本語環境のフォーマットにも対応しています。 依存関係はなし スタンドアロンの単体で動作する軽量JavaScriptで実装されたWebコンポーネント。 どこにでも使用できる どんなページにもどんなフレームワークにも設置可能。 プログレッシブエンハンスメント コードの読み込みに失敗した場合は、ネイティブのピッカーまたはテキストボックスにフォールバック。 アクセシブル マウス・タッチ・キーボード・スクリーンリーダーで動作し、ネイティブのフォーム要素として動作します。 多言語対応 デフォルトでブラウザのローカル言語と日付形式を使用します
無料で自分のブログやサイトに「カートに入れる」ボタンを追加しオンラインショップ化して好きなものを売れる「イージーマイショップ」実践レビュー、無料機能だけでもかなり使える
自分で本やイラスト、雑貨、アクセサリーを作ってブログやウェブサイトでそれを公開していても、いざ商品として売るとなると「管理がややこしそう」「ネットショップを作るのは大げさかな……？」と二の足を踏んでしまいます。ネットショップ作成サービスの「イージーマイショップ」は無料でさくっとネットショップを作ることができるだけでなく、手持ちのブログやウェブサイトに「カートに入れる」ボタンを追加するだけという使い方も可能とのことなので、実際にウェブサイトをネットショップ化させてみました。 ネットショップ開業はイージーマイショップ | セット販売やオーダーメイド商品に強いネットショップ構築 https://www.easy-myshop.jp/ 目次 ◆ブログに「カートに入れる」ボタンを追加するとこんな感じ ◆サクッとカートの埋め込みを設定してみた ◆注文を的確に処理できる「店長ナビ」 ◆どんどん機能追加し
無料＆簡単にオンライン予約システムが作れる「SELECTTYPE」レビュー、ウェブサイトへの埋め込みもラクチンで超絶多機能にすることも可能！
自分好みの予約システムを作る手順は簡単で、2つの手順に従うだけ、専門知識は一切不要。 1：あらかじめ用意されているテンプレートから一番変更しやすそうなものを選ぶ 2：自分の好みに合わせて変更 できあがったら、実際に予約する立場で試してみて、「これは使いにくいので変えてみよう」「こういう部分も予約時に決めてもらう方がよさそう」というようにしてブラッシュアップすればとりあえず完成。あとは本番で使ってみて初めてわかる点を改善していけば、どんどん使い勝手が良くなっていき、収益を押し上げてくれるとともに、管理の手間が減ってスムーズに運用でき、本来やるべき事に集中できるようになります。 というわけで、「SELECTTYPE」なら実際にどれぐらい簡単に作ることができるのかという気になる点を実践して確かめてみました。 予約システムつきホームページ【SELECTTYPE】 無料で予約フォーム付き予約システム
CSSとSVGでチェックボックスを装飾しよう！
2022年4月27日 CSS, SVG CSSでフォーム内の部品を装飾するのは、昔から難儀でした。特によく使うチェックボックスは色をつけることすら難しく、様々なCSSの小技やJavaScriptプラグインを使って実装してきました。今回はチェックマークにSVGを使い、なるべくシンプルな書き方でチェックボックスを装飾してみようと思います。 ↑私が10年以上利用している会計ソフト！ チェックボックスを装飾する手順 1. HTMLマークアップ まずはHTMLを書いていきます。label タグでチェックボックスを囲うと、for 属性や id 属性の指定をしなくても label タグ内のテキストがクリック範囲となるので便利です。テキストは span タグで囲みました。この span 部分にCSSでチェックボックスを表示させる指定をしていきます。 HTML <form> <label> <input t
ユーザーを離脱させない電話番号の入力フォームとは
UX Movementの創立者、ライター。ユーザーに優しいUXデザインのスキルを読者の方が上達できるよう、UX Movementのブログを始める。 電話番号入力フォームは、生年月日入力フォームと並んでくせ者です。たくさんのフォーマットがあり、どの入力方法が正しいかを見分けにくいことがよくあります。国番号を入力すべきか否かさえよくわかりません。 適切な入力フォーマットを判別できないと、ユーザーは電話番号入力フォーム以外の項目も入力内容が不適切なのではと不安になります。電話番号入力フォームでエラーがでると、フォーム入力自体を放棄してしまうかもしれません。 どのフォーマットが正しく、どのフォーマットでエラーが出るのかを、ユーザーが入力時に困惑しないように伝えるべきです。もしユーザーが困惑するようあればユーザー体験が乏しいということなので、デザインし直す必要があります。入力フォーム改善のためには、
新Googleフォームで問い合わせフォームを作る方法＆自動返信メール設定
ブログやHPに問い合わせフォームを作る方法はいくつかあります。 無料で作る方法としておすすめなのは、Googleフォームを使うことです。 ※大分 ブロッサムホテルにて iPhone SE 追記： 2018年5月、次の記事を書きました。 お問い合わせフォーム作成の流れとポイント お問い合わせフォームは、 ・お問い合わせ ・仕事の依頼 を受けるために必須です。 ブログやHPに必ず設置しましょう。 お問い合わせフォームの流れ お問い合わせフォームは次のような流れです。 フォームに入力していただく ↓ こちらが入力を知る（メールで届く） ↓ 返信する メールを送っていただくよりも入力者の負担が少ないのが、お問い合わせフォームのメリットといえます。 メールだと、挨拶、宛名、文章など考えることが増えるので、極力フォームを使いましょう。 項目は最低限にする お問い合わせフォームの項目は必要最低限にすべき
MW WP Formのフォームを複製する方法 - 西沢直木のIT講座
WordPressで問い合わせフォームを作成するMW WP Formプラグインは非常に便利なプラグインです。かなり細かい設定もできるので、もう1つ作るときは作成済みのフォームをコピーしたいところですが、MW WP Formのバージョン 3.2.1時点ではフォームの複製ができません。 「複製」メニューがないのでコピーできない MW WP FormプラグインでフォームをコピーするにはDuplicate Postプラグインを使う方法があります。以下、手順を紹介します。 「プラグイン」‐「新規追加」メニューからDuplicate Postプラグインをインストール、有効化します。これは投稿や固定ページをコピーできるプラグインです。 Duplicate Postプラグインのインストール 「設定」‐「Duplicate Post」メニューの「権限」を開いて「これらの投稿タイプに対して有効化」から「MW
システムで「性別」の情報を扱う前に知っておくべきこと - Qiita
0は性別に関する情報が得られない場合に使います。性別に関する情報はあるのだけど1とも2とも言えない場合は9を使います。要は「0でもなくて1でも2でもなければ9」です。 これを知っていればMだとかFだとかを議論をせずに済みますね。 国際規格に従うべき理由 国際規格に従うことは色々と利点があります。まず、どうしてそういうコード体系にしたのかを説明しやすいです。また多言語対応する際も規格通りに書けば伝わるはずなので迷わずに済みます。別システムへのデータの移行や、異なるシステム間でのデータの統合もコード体系が同じならラクラクです。もしかしたら別のプロジェクトで書いたコードをそのまま使いまわせるかもしれません。技術者に対するトレーニングも不要です。 対して、わざわざ国際規格に反する実装をする場合は上記のメリットがそのままひっくり返ってデメリットになりはしますが、もちろん、それなりの理由があれば規格と
メールアドレスの確認フィールドをなくすべき理由
UX Movementの著者、編集長。明快で効果的なデザインを愛し、ユーザのために日々奮闘しています。 メールアドレスは、もっとも間違いやすいフォームフィールドの１つです。 入力データにはさまざまな種類の文字による長い文字列が含まれているため、間違って入力してしまいがちです。これにより、ユーザーが間違ったメールアドレスを送信する可能性があるのです。 メールアドレス確認の問題 デザイナーは、メールアドレスの確認フィールドを追加することで、間違ったメールアドレスの送信を防ぐことができると考えています。メールアドレスの確認フィールドの追加で誤送信を何件か防ぐことはできるかもしれませんが、必ずしもすべてを防ぐことができるというわけではありません。 多くのユーザーは、メールアドレスの入力内容をコピーして、確認フィールドに貼り付ける傾向があります。これでは、ユーザーが間違ったメールアドレスを貼り付ける
見落とされがちなアカウント概念のデザイン
わりかん・決済アプリ「paymo」を運営する AnyPay, Inc.のPM & UI/UX Designer。技術とデザインの力をプロダクトに結集させるプロセスがとても好き。Twitterは@ikutani41。 WebサービスやiOS/Androidアプリのデザインをするとき、どのようなアカウント概念を採用するか検討したことはあるでしょうか？ ほとんどのアプリは、ユーザーごとにアカウントを作って情報やログを紐づけたり、機密情報を扱う場合は認証機構を設けたりする必要があります。また、どのようなタイミングで、どのような操作でアカウントを作ってもらうかはとても重要で、さまざまな選択肢があります。 一般的なデザイン アプリをインストールして初めて開いたとき、下図のような画面をよく見るかと思います。 こういったデザインが採用される背景には、理由があります。 ユーザが慣れているため操作に迷いにくい
徹底図解 入力フォームのデザイン・UXを高める15の方法 - ポップインサイト
サインアップ画面やデータ入力画面の「フォーム」は、サイトやアプリ設計において最も重要な要素の1つです。本記事では、入力フォームデザインのUXを高める15のルールをご紹介します。 ポップインサイトでは、ユーザーリサーチのファクトにもとづいたWEBサイト改善を支援しています。WEBサイトのUX改善に課題がある方はお気軽にご相談ください。⇒UXデザイン/UXリサーチについて相談する ※紹介資料の無料ダウンロードはこちら ※関連記事：【EFOとは？】入力フォーム最適化施策8選：CVR（コンバージョン率）改善のコツ ※この記事はuxdesign.ccの記事を許可のもと翻訳・編集したものです。 翻訳元記事：Design Better Forms (2016/7/5) 著者：Andrew Coyle
アンケート調査・作成ならWebアンケートシステムQooker（クッカー）
アンケート用紙からクッカーに変えましょう。 Webアンケートシステム・クッカーは、インターネットでアンケート調査をするためのオンラインWebアンケートシステムです。 アンケート用紙を使った従来の方法に比べ、アンケートの作成から集計までの手間や時間、コストを飛躍的に削減できます。 クッカーを使えばネットリサーチ会社に頼ることなく、どなたでも簡単にネットリサーチができます。
意外と知らない !? お問い合わせフォーム「Contact Form 7」をもっと便利に使いこなすための3つのポイント | 無料WordPressテーマ BizVektor [ ビズベクトル ]
確認用に必須項目のチェックボックスを追加するだけで3つの効果!! 見逃してるかも!?応答メッセージボックスの位置を変えてみよう！ Google Analyticsでコンバージョン（お問い合わせ率）を計測する方法 確認用にチェックボックスを追加するだけで3つの効果!! ※2015/6/19 一部情報が古かったため、書きかえました。Contact Form 7のキャプチャ画像はVersion 4.2のものです。 【1】確認画面がなくても安心して使える 「Contact Form 7」は、確認画面がありません。これは確認画面が日本特有の文化だからという事に関係するのですが、日本人としては確認画面があると思ってボタンを押したらそのまま送信されてしまい、戸惑うユーザーが多いのも事実です。 このチェックボックスがあることにより、一度内容を確認してから送信ボタンを押してもらえるので安心です。 【2】入力
![意外と知らない !? お問い合わせフォーム「Contact Form 7」をもっと便利に使いこなすための3つのポイント | 無料WordPressテーマ BizVektor [ ビズベクトル ]](https://cdn-ak-scissors.b.st-hatena.com/image/square/888e16f0ff1723887cfbfc4ec1a0abe746176f5b/height=288;version=1;width=512/https%3A%2F%2Fbizvektor.com%2Fwp-content%2Fuploads%2Feyec_contactform7.jpg)
無料で入力フォーム作成が可能で高度な顧客管理も可能なサービス「formrun」
無料でインターネット上の問い合わせフォームを作成し、問い合わせのあったユーザーの情報や対応状況などを管理できるサービスが「formrun (フォームラン)」です。いつでもネットさえあればフォームを作成してユーザーごとの対応状況を詳細に管理できるということだったので、どんなことが可能なのか使ってみました。 無料で使えるメールフォームと顧客管理 | formrun (フォームラン) https://form.run/ja formrunを使うと、以下のような問い合わせフォームを簡単に作成することができます。表示している画像や項目は自由に設定することができるので、企業ロゴを入れたり、必要な情報をカスタマイズすることが可能です。 寄せられた情報は、ネット上でグループを作って管理することが可能。グループ全員で情報を一元管理できるほか、個別のユーザーの進捗状況を記入して情報の漏れがないようにすることも
テキスト入力の自動遷移 - 徒然なるままに
クレジットカードの番号とかを入力するときにテキスト入力を自動遷移させたいことがある。いろいろ参考にしながらレガシーな形でコードを書いてみた。簡単な実装だけどとりあえずは動くと思う。 <!DOCTYPE html> <html> <head> <title>Test</title> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <meta http-equiv="content-script-type" content="text/javascript" /> <meta http-equiv="content-style-type" content="text/css" /> </head> <body> <form> <input type="text" name="card1" onkeyup
UXを向上させる５種類のアニメーションの使い方 | UX MILK
Nick Babich氏はソフトウェアディベロッパーです。大のテクノロジー好きで、UI/UXをこよなく愛します。彼のwebサイトはこちらです。http://babich.biz。 モーションはストーリーを伝えます。長く複雑なストーリーではなく、「今ここを見て下さい」や、「操作は正常に完了しました」などのシンプルなストーリーです。 しかし、アニメーションの目標は、ユーザーを楽しませることではありません。ユーザーが何が実行されているか理解し、より便利にアプリを使う方法を理解するための手助けするためにあります。このアイディアは、Zurbの記事にある次の言葉の中ではっきりと表現されています。 We’re no longer just designing static screens. We’re designing for how the user gets from those screens
コンバージョン率を改善する入力フォームにおける10のルール
Nickはロシアのセントピーターズバーグ出身のソフトウェアデベロッパー/ブロガーです。彼による他の記事はこちらをご参照ください。 Webやアプリ内のフォームは、ユーザーとの最も大切なやり取りの場の一つです。サービスへの登録や予約、フィードバック、決済処理など、ユーザーと企業間の取引を開始したり、ユーザーいにあらゆる情報を入力してもらうべく、様々なところで使われています。 ユーザーがいかに素早く正確に情報を入力し、求める情報を最後まで入力してくれるかはこのフォームの出来にかかっています。 この記事ではフォームのデザインにおいて、様々なテストやユーザーの声などから導き出された、実用的な施策を紹介します。 1. フォームは論理的に並べる フォームは対話そのものです。従って、普通の会話の様に、ユーザーとアプリの２者間でのコミュニケーションとして表現されるべきでしょう。 質問は直感的な順番にする。ユ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
The Blog | Welcome to Adobe Blog
