ノムリッシュ翻訳サイトのUI・UXデザインを検討してみた ➀ファーストビュー編

らぴ
466

…やぁ、ここであったが百年目だね…今回はノムリッシュ秘されし真実と生きる元老院のUIUX錬成を検討していく…まるで異界<ビヨンド>にある虚の中でのようによ(訳こんにちは。今回はノムリッシュ翻訳サイトのUIUXデザインを検討していきます。)

ノムリッシュ語の由来は通称FFのキャラクターデザインを携わったクリエイターの野村哲也の世界観を指し独特なストーリーやセリフなども「ノムリッシュ語」と呼ばれるようになったそうです。最近ではFF7のリメイク作品も話題となっており、皆さんもシリーズのいずれかをプレイはしたことがあると思います。

今回は日本語をそのような厨二とも言い難い独特なノムリッシュ語へと翻訳できるサイトがあるということですのでPCデザインの方でリサーチしていきたいと思います。

racing-lagoon.infohttps://racing-lagoon.info/nomu/translate.php

【メディア領域 ノムリッシュ翻訳サイトのUIUXデザインを検討してみた】

①ファーストビュー編

ファーストビュー


さてファーストビューですが、画面上部には様々な機能がセットとして並べられていますね。ビジネッシュは所謂意識高い系(MTGのアジェンダしといて)、福本語は所謂カイジ系(圧倒的感謝っ・・・!)へと翻訳するものです。ネームメーカーは入力した名前をノムリッシュネームへと翻訳するものです。

皆さんにとってアイキャッチ⁻目線が止まるエリアはどのあたりでしょうか?このデザインでは画面下部、特にノムリッシュ翻訳に注目されると考えられます。理由としては画面スペースの配分において下位の3つ(お知らせ、翻訳、検定)がサイズが大きく純粋に視界に入りやすいことと、人は画面中心を見る傾向があるためです。

しかしながらデザインに無駄が多く改善点が多く見られます。このサイトでのメイン目的は翻訳機能であり、それぞれの翻訳ページへと導くことがデザインとして求められます。

それらを踏まえて主な改善点は3つあります。

1:それぞれの翻訳ページのデザインを明確化

1に関してメイン機能は「ノムリッシュ翻訳」「ノムリッシュ検定」「福本語翻訳」・「ビジネス語翻訳」の4つであり、これらの4つの機能をはっきりと主張する必要があります。すなわちファーストビューにおいて、より良くアイキャッチをされやすいようにします。要は情報にメリハリをつけましょう。

2:翻訳機能がどのようなものかを一目で理解する

2に関して例えばノムリッシュ語がどのようなものか、FFを知っていたとしても初見にとっては分からないと思います。そこで一言程簡潔にどのようなものかメッセージを記しておく必要があります。「ノムリッシュ語は日本語をFF風に翻訳できます」と記しておけばそれだけである程度理解することが出来ます。

3:ページへのアクションボタンを視覚的に分かりやすく導入する

3に関してはアクションボタンがどこか分かりにくいため統一してボタンを導入する必要があると考えられます。その際それぞれの機能に則したボタンデザインをすると雰囲気的にも味わうことが出来ると考えられ促進要因になります。

これらを踏まえて簡潔に構図としてデザインしたのが下記になります。(あくまで視認性に考慮した上でのサンプルですので本格的にフォントや色、ロゴなどにこだわるとキリがないので割愛します)

本格的にデザイン・編集したい方はAdove XDを使ってみてはいかがでしょう

https://www.adobe.com/jp/products/xd.html

Before

After

PCデザイン画像を導入すると少しスペースをとってしまうので、次回翻訳機能の使用感の方を検討していきたいと思います。

皆さんも実際にそれぞれの翻訳機能を試してみてはいかがでしょう。

racing-lagoon.info(https://racing-lagoon.info/

閲覧圧倒的感謝っ・・・!

次回:https://cxbottle.com/users/idearahppy/nNVJrTimt6Oz7t3xrtzR

【さらにCVR向上を検討している方へ】

【CX BOTTLE】を運営しているビーンズでは直帰率改善やLPOに使える具体的でCVRを改善する確度の高い施策を毎月提案する事業を行っています。

初回の打ち合わせでは無料でサンプルの提案を受けとれますので試しに利用してみてはいかがでしょうか。

ビーンズhttps://leango.co.jp/beans

記事スコア: 466

らぴの他の記事も読む

  • 世界的人気ゲーム「クラロワ」から見るCX事例

    皆さんは「クラロワ」というゲームをご存知でしょうか?「クラロワ」は「クラッシュ・ロワイヤル」の略称でありフィンランドのゲーム会社・Supercellが開発・運営している世界的人気アクションゲームとなっており、世界で1億以上のユーザーがいます。クラロワ公式サイト 続きを読む

  • 乙女向けリズムゲームのUI・UXデザインを比較してみた⓶ホーム画面編

    月日は白代の過客とやら、久しぶりに起動したアプリがサービス終了になっていて嘆いています。あゝ諸行無常かな。思い入れと思い出は比例し、喜怒哀楽あらゆる感情を受け入れる包容力を育てていきましょう。今回は前回の続きで下記の3作品のホーム画面のデザインを比較していきた 続きを読む

  • 乙女向けリズムゲームのUI・UXデザインを比較してみた ⓵タイトル画面編

    昨今の世界情勢と言えば陰鬱で暗い日々が続きますね。コロナに財政、人間関係のしがらみまで、現実世界は辛いことが多くありませんか?そんな日々だからこそ、老若男女、乙女も乙男も腐女子も腐男子も皆さん揃って、非日常の世界へ飛び込み、充実感と光を与えてくれる「アイドル」 続きを読む

  • ノムリッシュ翻訳サイトのUI・UXデザインを検討してみた⓶翻訳機能編

    さてさて今回は前回のファーストビュー編から続いてサイトのメインである翻訳機能について検討していきます。どのような機能か楽しみですね。ではでは☆彡racing-lagoon.info(https://racing-lagoon.info/)前回はこちらファースト 続きを読む

  • EFOに役立つ各企業EF事例 【フード領域】ピザ屋の入力フォーム編🍕

    お疲れ様です。今日で緊急事態宣言が解除され自粛生活も少しは改善されると思われますが、まだまだ気を緩めずにいきたいですね。さて、昨今の自粛生活に伴いデリバリーサービスの需要は高まっています。今回はそのようなデリバリーサービスの入力フォームを比較検討していきたいと 続きを読む

  • EFOに役立つ各企業EF事例 【フード領域】お持ち帰り寿司のフォーム編🍣

    お疲れ様です。青嵐日和につきヤンチャ風が様々なモノを運んできます🍂さて今回は寿司屋のウェブ注文可能のお持ち帰り入力フォームを比較検討していきたいと思います。フォームの比較検討を行うことでそれぞれのデザインを参考し、より良いフォーム作成、CVR改善につながると 続きを読む

  • EFOに役立つ各企業EF事例 【フード領域】デリバリーサービス入力フォーム編🏍

    お疲れ様です。昨今では緊急事態宣言が解除されつつあり人混みもチラホラと見えてきています(通勤・通学時のは人口密度は相変わらずですが笑)。さて、時代の影響もありデリバリーサービスの需要は高まっています。コミュ障・出不精の私にとってはサクッと頼むことができ、急な訪 続きを読む

  • 補足:陰鬱な日々にさよなら!? ペット業界のUI・UXデザインを比較してみた🐶🐱

    ぼんそわーるm(__)m今回は前回の補足でペットショップの問い合わせフォームの比較を行っていきたいと思います。フォームの比較検討を行うことでそれぞれのデザインを参考し、より良いフォーム作成、CVR改善につながると考えられます。扱うサイト様ペットン(https: 続きを読む

  • 陰鬱な日々にさよなら!? ペット業界のUI・UXデザインを比較してみた🐶🐱

    ぐ~てんだ~、いかがお過ごしでしょうか自粛生活が続いており陰鬱ムードが続きますね。そんな日々だからこそ、家庭内で寄り添ってくれるパートナーとしてペット市場が注目されてきています。さて今回はそのようなペットショップのPCデザインを比較していきたいと思います。PC 続きを読む

  • EFOに役立つ各企業EF事例 【フード領域】バーガー店のフォーム編🍔

    ご無沙汰しております。「いただきます」という言葉は英語だと該当する言葉がなく、訳するなら「Let's eat」ぐらいになるそうです。食べ物に感謝する姿勢は様々ですが、日本特有のこのアイデンティティは大事にしていきたいですね。さて今回はバーガー店のフォームを比較 続きを読む

  • EFO(入力フォーム最適化)に役立つ各企業EF・EFOツール事例まとめ

    お疲れ様です。人生は選択の繰り返しと言いますが、皆さんは最適な選択を行えていますか?サイト運営においてEF(入力フォーム)のデザインというものはCVRに強く影響があり、どの企業においても最適化、EFOを行うために工夫されています。今回はそのようなEFO事例につ 続きを読む

  • EFOに役立つ各企業EFOツール トライアル可能EFOツール編

    お疲れ様です。CVR改善にあたってEFO(入力フォーム最適化)は避けては通れない道です。今回はEFO改善に用いられるEFOツールのうち、無料を含めトライアル可能ツール一覧についてまとめていきます。トライアルツールは期間が短く、機能制限などの傾向があるため期待し 続きを読む

  • EFOに役立つ各企業EF事例 【フード領域】ファミレスのフォーム編🍴

    さて今回はファミレスのスマホ版のメニュー及び検索フォームを比較検討を行っていきます。飲食店ではどのようにメニューを表示するか、見せ方次第で売り上げも変わってきます。フォームの比較検討を行うことでそれぞれのデザインを参考し、より良いフォーム作成、CVR改善につな 続きを読む

  • 初心者でもできる簡単サイト形成-WordPressを用いて

    昨今ではウェブマーケティングへの関心も高まってきており、様々なプロダクトが広まっています。アフィリエイトサイトを作成したり、フリーランスで様々な活動を行っている方も少なくはないと思われます。サイト運営の際、CVRなどに関するトラブルや問題が生じた時【CX BO 続きを読む