タグ

formに関するzaki1010のブックマーク (17)

  • Google Forms APIが正式リリース。Googleフォームの作成や編集、集計などをプログラミングで制御可能に

    Google Forms APIが正式リリース。Googleフォームの作成や編集、集計などをプログラミングで制御可能に アンケートやクイズなどを簡単に制作できるGoogleフォームをAPI経由で作成、編集できる「Google Forms API」が正式版となったことを、Googleが発表しました。 Introducing the new Google Forms API! Developers can now build powerful integrations on top of Forms. Here's how you can use the new Forms API and what’s in it → https://t.co/zLcaEw2ru1 What will you build for Google Workspace? pic.twitter.com/oSkPqx

    Google Forms APIが正式リリース。Googleフォームの作成や編集、集計などをプログラミングで制御可能に
  • デザインに少し手を加え、フォームを改善する実践的なUIのテクニックのまとめ

    フォームを改善するUIデザインのテクニックを紹介します。 フォームのデザインに少し手を加えるだけで、ユーザーにとって使いやすい、コンバージョンを高めるための実践的なテクニックが満載です。 15 UI Tips for Better Forms by Jim Raptis 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに 01. ラベルを常に記述する 02. Zパターンを避ける 03. ラベルを入力欄の上に配置する 04. 右揃えのラベルを使用する 05. 関連する入力欄をグループ化する 06. ユーザーフローを尊重する 07. スペースを与える 08. ラベルの繰り返しを避ける 09. エラーメッセージは分かりやすく 10. 必要に応じてドロップダウンを使用する 11. プレースホルダーを活用する 12. ボタンは1つに

    デザインに少し手を加え、フォームを改善する実践的なUIのテクニックのまとめ
  • 「丁目、番地が全角しか入力できない」「何の入力チェックでエラーが出ているのかわからない」みんながネットでイラつく#クソ入力フォーム選手権 開催中

    米村歩@日一残業の少ないIT企業社長 @yonemura2006 ・丁目、番地が全角しか入力できない ・電話番号が全角しか入力できない ・建物名が全角しか入力できない ・生年月日がカレンダーで果てしなきページ送りを要求される ・何の入力チェックでエラーが出ているのかわからない ・入力チェックエラーになると入力内容が全部消える #クソ入力フォーム選手権 2021-09-06 22:44:39

    「丁目、番地が全角しか入力できない」「何の入力チェックでエラーが出ているのかわからない」みんながネットでイラつく#クソ入力フォーム選手権 開催中
  • フォームバリデーションと送信ボタンの状態の最適解 - Konifar's ZATSU

    タイトルを見て「あーあれね」と思った人もいると思うが、アプリデザインの世界ではすでに議論され尽くされているであろうこの話題について雑に考えをまとめておきたい。とは言っても明確な答えがあるわけではないので意見がほしいというのが正直なところなので、もしフィードバックがあれば @konifarまで直接教えてもらえると嬉しい。 何を言いたいのかというと、『フォームに入力されていない or 入力された文字が異常である場合に送信ボタンを押せる状態にするか押せない状態にするか』という話だ。たとえば次のように氏名を両方入力しなければいけないケース。 初期状態の送信ボタンがdisabledで、入力に応じて状態が切り替わる。 当に送信できる時だけ送信ボタンがenabledになるというのはわかりやすそうだが、問題もある。入力項目が多くなってきた時に、ユーザーがなぜ送信ボタンを押せないのかわからないかもしれない

    フォームバリデーションと送信ボタンの状態の最適解 - Konifar's ZATSU
    zaki1010
    zaki1010 2018/01/29
    激しく同意。わからない人のわからなさ方向の可能性は無限。
  • 行動を支えるデザイン 【ユーザー名編】|きよえ氏さん

    Connehito inc. ママリのデザイナー きよえ氏です。サービスデザイン全般を担っています。 先日、ママリの登録導線をリニューアルしました。その振り返りをしている際におもしろい改善を見つけたので、noteにまとめてみようと思います。 入力フォームのUI改善以下はママリの初回登録時に通る「ニックネーム登録画面」です。左がこれまでのUI、右がこれからのUIです。 ボタンや文言など全面的に改善を行ったのですが、その中で特に工夫したのは「入力フォームの表現」です。 入力フォームの右側に"さん"を配置することで、ママさん同士でコミュニケーションしやすいユーザー名を登録してもらえるように体験設計をしました。 ママリはママさん同士が会話をしながら課題解決を行う場所なので、コミュニケーションのしやすさは非常に重要です。現状のママリは、匿名でありながら、その先にいるママを感じられる、いわば"2.5次

    行動を支えるデザイン 【ユーザー名編】|きよえ氏さん
  • 使いやすいフォームデザインのための新しい4つのルール

    大規模なECサイトにおけるUXチームのリードであり、レンセラー工科大学でヒューマン・コンピューター・インタラクションの修士号を取得しています。Webサイト、Twitter。 私たちは日々、オンライン上でフォームを使っています。購入を完了するため、メーリングリストやソーシャルネットワークなどに登録するため、ディスカッションに参加するため、美味しそうなランチの写真を投稿するためなど、フォームを使う場面はさまざまです。オンラインで情報を入力するために、フォームは必要不可欠と言っても過言ではありません。 しかし、長きに渡ってフォームの改善はあまり見られませんでした。「使える」ものではあったものの、「使いやすい」ものには至らなかったのです。 近年では新しいテクニックを正しく使うことで、デザイナーはより早く、簡単で、生産性のあるフォームの作成が可能になっています。 フォームは短ければ良いのか 「フォー

    使いやすいフォームデザインのための新しい4つのルール
  • スマホに最適化させたエントリーフォーム 〜3つの基本方針〜 | PSYENCE:MEDIA

    この記事は RECRUIT MARKETING PARTNERS Advent Calendar 2015 の投稿記事です。 こんにちは、デザイナーの石黒です。 現在は英語サプリ、受験サプリでUXUI設計ディレクションを担当しています。 今回は受験サプリで行ったスマホにおけるエントリーフォーム改善のお話をしたいと思います。 受験サプリとは受験生の2人に1人が利用するオンライン学習サービスです。大学受験や苦手克服、定期テスト対策に役立つ機能に加え、カリスマ講師が教える豊富な講義ラインナップで苦手克服をしたい高校1、2年生から難関大学を目指す受験生まで自分にあった講義をご活用いただけます。いつでも、どこでも、何度でも、空いた時間や好きな場所で勉強でき全ての機能を980円(税抜き)で使い放題なサービスです。 エントリーフォームのUI改善とは 改善前の受験サプリのスマホ版エントリーフォームは、『

    スマホに最適化させたエントリーフォーム 〜3つの基本方針〜 | PSYENCE:MEDIA
  • 今どきの入力フォームはこう書く! HTMLコーダーがおさえるべきinputタグの書き方まとめ - ICS MEDIA

    みなさん、入力フォームを制作する際、どのような施策をおこなっていますか? 入力項目を見直したり、入力ステップを明確にしたりなど、入力フォーム最適化をおこなっていると思います。そのことで、コンバージョン率があがったり、ユーザーがストレスを感じないようになるでしょう。入力フォーム最適化はEFO対策 = Entry Form Optimizationとも呼ばれます。 サイトの設計段階で検討すべきことが多いですが、コーディングでも考慮すべき事が多々あります。今回はHTMLコーダーがエントリーフォームを制作する際に考慮すべき点について紹介します。 ※記事では最近のブラウザに適したHTMLコーディング方法の紹介を目的としています。そのため、デザインとアクシビリティーでのベストプラクティスを紹介したものではありませんのでご了承ください。 自動入力機能に対応しよう Google Chromeデスクトッ

    今どきの入力フォームはこう書く! HTMLコーダーがおさえるべきinputタグの書き方まとめ - ICS MEDIA
  • [JS]このアイデアは面白い!セレクトボックスの選択肢をすぐに選択できるようにするスクリプト -Quick[select]

    フォームのセレクトボックスは多くの選択肢を配置できる便利な要素ですが、他のフォームと操作性が異なるため一連の流れで入力しにくいのが弱点です。 セレクトボックスの操作性を改善し、デザインも簡単に変更できるスクリプトを紹介します。Quickの名前の通り、すぐに選択できるようになります。 通常のセレクトボックスの挙動 セレクトボックスは、タップとクリックの2つのオペレーションがあります。これはフォームの他の要素と操作性が異なり、ユーザーをフォームの一連の流れから外してしまうものです。 そこで注目すべき点は、通常セレクトボックスの選択肢の中にはより多く選択されるものがあることです。上記の例だと、「はい」「いいえ」が多いでしょう。 Quick[select]は、セレクトボックスの選択肢の中から、いくつかを表示させておくことができます。

    [JS]このアイデアは面白い!セレクトボックスの選択肢をすぐに選択できるようにするスクリプト -Quick[select]
  • クレジットカードフォームの解剖学 | POSTD

    オンラインでクレジットカードを使って支払うことは簡単ですよね?この答えはYesでもNoでもあります。Yesの理由は、インターネットが普及された初期からずっとそうしていたから(例:Amazon)。Noの理由は、まったく同じクレジットカードフォームは2つとないからです。 過去20年以上で、私たちはオンライン支払のメンタルモデルを作り上げてきました。「財布からクレジットカードを取り出して、ウェブのフォームに必要なカード情報を入力、そして申込みボタンを押す」というものです。しかし、ユーザーが答えないといけない質問でいっぱいなので、全てを入力するのはとてもややこしい行為になってしまいます。そして言うまでもなく、誰も取扱い説明書なんて読みたくありません。 さまざまな有名ウェブサイト・アプリのクレジットカードフォーム 何かの代金をオンラインで支払う時は、人へ支払う時より2,3倍遅れをとります。端末のボタ

    クレジットカードフォームの解剖学 | POSTD
  • EFO(エントリーフォーム最適化)ナビ | コンバージョンアップ

    人気の記事 TOP5 Androidの便利機能!? スペース自動入力機能にご注意 19,903ビュー | カテゴリ: EFO実践, 事例検証 スマホサイトのバナーの見せ方 6,214ビュー | カテゴリ: 事例検証 フォームに使うプレースホルダの利点と欠点 5,413ビュー | カテゴリ: EFO基 最新のWebブラウザシェアを調べる統計サイトまとめ 5,162ビュー | カテゴリ: マーケティング SSL証明書のSHA-1利用期限とブラウザ対応まとめ 4,015ビュー | カテゴリ: 統計・まとめ etc 最近の投稿 話題のPWA(Progressive Web Apps)のまとめ モバイルフォーム最適化のアイデア:モバイルEFO 今さら聞けないマーケティング重要略語集(数字編) 【定期】マーケットシェア関連まとめ|インフルエンサー編 コンバージョン率の最適化に関する誤解 カテゴリー

  • 入力フォームのプレースホルダーを使ってはいけない

    入力フォームのプレースホルダーテキストは、入力欄にどんな情報を入れたのかをユーザーが思い出すことや、エラーのチェック・修正を難しくしてしまう。また、視覚や認知機能に障害のあるユーザーにはさらなる負担となる。 Placeholders in Form Fields Are Harmful by Katie Sherwin on May 11, 2014 日語版2014年6月17日公開 コンテクストに沿った説明やヒントは、入力フォームのそれぞれに何が入るかを明確にするのに役立つ。その結果、入力が促進され、コンバージョンレートは向上する。ヒントの提供方法はいろいろとある。実装として一般的なのは、入力フォーム内に説明を入れるやり方だ。しかし、残念ながら、入力フォーム内のプレースホルダーはユーザビリティに役立つよりも損なうことのほうが多いことがユーザビリティテストでは繰り返し示されている。 ラベル

    入力フォームのプレースホルダーを使ってはいけない
  • コンバージョン率アップ!入力フォーム最適化(EFO)14のポイント

    あなたのサイトの入力フォームは、お客様にとって使いづらいフォームになっていませんか?フォームはお客様のストレスを最大限に減らし、快適で分かりやすいフォームにしなければなりません。フォームの使いやすさ、つまりユーザビリティは入力完了率やコンバージョン率に大きく影響するからです。 そしてフォームのユーザビリティを上げるには、入力フォーム最適化(EFO)をする必要があります。フォームの最適化をすることでユーザビリティが向上し、コンバージョン率の向上に繋がります。そこで今回は、具体的にどのような入力フォーム最適化をすれば良いのか、改善例を元にご紹介します! そもそも入力フォーム最適化(EFO)とは? 入力フォームからのコンバージョン率が低い場合、まずはコンテンツやデザインを見直します。しかし、あなたは入力フォームを見直したことがありますか?コンテンツやデザインの見直しも重要ですが、コンバージョンに

    コンバージョン率アップ!入力フォーム最適化(EFO)14のポイント
  • 勝手にEFO分析-エントリーフォーム改善 コーナーの記事一覧 | Web担当者Forum

    勝手にEFO分析-エントリーフォーム改善 コーナーの記事一覧 | Web担当者Forum
  • 分かりやすいWeb入力フォームのための十戒 | POSTD

    1. 各々の入力欄に、常に見えて分かりやすいラベルを付けよ 記入する前の入力欄にだけ、フォームのラベルを表示するのがWebデザインの主流になっています。これはユーザネームやパスワードなどを入力する際にはシンプルで使い勝手がいいのですが、それ以上に長い文字列になると少々勝手が悪くなります。 そのため余白があるのであれば、ラベルを表示すべきです 特に、長いフォームの場合では、ユーザは入力したものを見直すでしょう。どのラベルが入力欄と合致するのか分からなければ、間違いがないよう見直すことなどできるはずがありません。 改善前:入力欄中にラベルが記入してあります。今は見やすいかもしれません。 しかしフォームに入力するとラベルが見えなくなってしまい、間違いを見つけにくくなってしまいます。 改善後:それぞれの入力欄に、クリアでいつでも見えるラベルを付けましょう。 2. 十分な大きさのフォントを使用せよ

    分かりやすいWeb入力フォームのための十戒 | POSTD
  • 国勢調査「名前入力できない」続出 (web R25) - Yahoo!ニュース

    5年に一度実施される国勢調査がスタート。今年は、初めて全世帯を対象にインターネット回答を実施しており、ネットでの回答期間は9月10日から20日までとなっている。ツイッター上には、実際にネットで回答したという人からの報告が続々とあがっているところだが、困惑する声も散見される。 その困惑のひとつは、「名前の入力欄」に関するものだ。ツイッターには、 「国勢調査をインターネット対応しました。名前入力欄でいきなり『入力禁止文字を入力しないでください』の注意MS。戸籍上の正式な漢字なのに腹が立ちました。クレジット会社等は環境依存文字とか優しい言葉なのに。流石お上、見下した言葉、別の言い方があるだろ。ゴメンなさい、愚痴で」(原文ママ) 「国勢調査で案の定名前入力の際に『その漢字は使用できません』ってなって別の漢字使ったけどいいのかな。まぁ、問題あれば何かしら通知がくるでしょう」 「国勢調査のネッ

    国勢調査「名前入力できない」続出 (web R25) - Yahoo!ニュース
  • こんなにあった!シニア対応を本気で進める『皇潤』の入力フォームが使いやすい理由 | マミオン有限会社-パソコン・数学研修、法人研修

    シニアがウェブサイトを利用する際の大きなハードルの一つが、各種「入力フォーム」です。 一般的にシニアの方ほど入力に時間がかかり、また不適切な入力によるエラー発生頻度も高くなることは、ユーザビリティ業界の権威であるニールセンノーマングループのレポートも統計データを用いて指摘しています。 シニアをターゲットとしたウェブサイトの多くはこうした状況を考慮して、入力フォームのシニア対応に力を入れているところが多いのですが、その中でも私個人から見て特に完成度が高いと感じているのが、健康品の『皇潤』で有名なエバーライフです。 今回、そのエバーライフの入力フォームで実装されている様々なシニア対応施策について、実装方法まで含めて詳しくご紹介していこうと思います。 1. 各フォームがそこそこ大きく見やすい 2. 必須項目表示がわかりやすい 3. ふりがなが自動的に入力される 4. 住所が自動的に入力される

    zaki1010
    zaki1010 2014/12/16
    素晴らしくありがたい記事。ただ、姓名をひとつのフィールドにすると、区切られなかった瞬間に詰むんだよなあ。
  • 1