WebサイトのUIUXを改善する、というプロジェクトを任されたときに非デザイナーが困るのは、「そもそもUIUXの改善とは何か?」ということが分からないという場面です。

そのくらいは流石に分かる、という方も多そうですが、非デザイナーで初の発注であれば、まず間違いなく実際の場面では様々な困難にぶつかることでしょう。

なぜなら、UIUXとは、見ただけでは理解できない様々なノウハウの集合体です。何となく使いやすい。何となく使いにくい。そんな『何となく』は、信じられないほど多くのノウハウによって構築されるものです。未経験の非デザイナーには、指示することすら困難でしょう。

そんな困っている今のあなた、あるいは未来のあなたに向けて、今回はWebサイトのUIUXの改善に役立つ参考サイトを、いくつかご紹介します。

これらのサイト活用すれば、各作業の解像度が上がり、間違いなくコミュニケーションが円滑に運ぶことでしょう。

WebサイトUIUX改善で参考になるサイトは以下の通りです。

Cocoda!
https://cocoda-design.com/

Progate
https://prog-8.com/dashboard

サルワカ
https://saruwakakun.com/

chot.design
https://chot.design/

伝わるデザイン
https://tsutawarudesign.com/

ソシオメディア
https://www.sociomedia.co.jp/category/blog

それぞれ説明していきます。

Cocoda!  

UI設計を学べる無料の学習サービス。それがCocoda!です

主にデザイナー的思考の理解に向いたサイトで、初心者向けをターゲットとして制作されたUI設計の学習サイトとなります。

学習コンテンツとしては、主に『基礎トレーニング』と『Daily Cocoda!』の二つがありますが、非デザイナーが取り掛かるのは『基礎トレーニング』がおススメです。初心者向けの内容になりますので、デザイナーがどんな考えの元にUIを設計しているか、という事の基礎が理解できることでしょう。

Cocoda!は初心者向けを謳っているだけあってとっつきやすいのが特徴で、取り組むべきお題も、用意する画像も、全てCocoda!側で用意されています。

また、非デザイナーでも、実はデザイン事業に興味がある、という場合は、このCocoda!でポートフォリオ、という実績まとめの様なものを作成することが出来ます。そのため、もし非デザイナーからデザイナーに転職したい、という場合でも、Cocoda!は力強い味方になってくれるでしょう。

Progate  

Progateは初心者向けのプログラミング学習サイトです。

無料で学習コースの途中まで。有料では最後まで。様々な言語に対応した、学習サイトとなります。

非エンジニアとしては無料分でも十分学習できるので、プロジェクトに対応する言語を一通り触ってみるのも学びになるかと思います。

Cocoda!と同じく完全な未経験でも触りやすいサイトで、ゲーム感覚でスキルを身につけられるのが特徴です。サイト内で言語に対する知識のインプット、そしてそのアウトプットが流れるように行われるため、学習サイトとしてはかなり優秀といえるでしょう。

特に学習フローで特徴的なのは、回答した後に自分の答えと他人の答えを比較することが出来る点です。エンジニアは動くコードを書くことだけが仕事ではなく、後々の作業者が読みやすいように、コードを整理することも仕事の範疇に含まれます。非エンジニアでも、「こういう形のコードだと読みやすいのか」という学びになることと思います。

また、ある程度知識がある方の場合でも、今話題の新しい言語に触れてみたい、という軽い気持ちのも可能です。様々な言語の学習活用コースが実装されているため、きっとお望みのコースが存在することでしょう。

サルワカ  

サルワカは、サルでもわかる図解説明マガジンをコンセプトに作成された、ブログサイトです。

主に取り扱うトピックは、初心者向けのWebデザイン、コーディングとなります。コーディングとはつまり、HTML/CSSなどのプログラミングということです。

このサルワカの特徴としては、WordPressでも使いやすいと評判のSANGOというテーマの制作者が運営しているという点です。

ただ、非デザイナー/非エンジニアの方にWordPressやテーマと言っても分からない可能性があるかもしれませんので、一旦こちらも説明しておきます。

まず前提としてWordPressとは、ブログ的な側面の強いサイトを運営する場合に使用するテンプレートです。

ネットで書品を販売するサイトであるECサイトが主にEC-CUBEと呼ばれるテンプレートを使用するように、ブログを開設するならWordPressというテンプレートを使用することになります。

そしてその内、SANGOとは、WordPressをさらに使いやすくするテーマ、つまり、ブログを書くためのWordPressを使いやすくする追加アタッチメントに近い存在です。

そのSANGOの制作者が「SANGOをこのように使うとブログサイトをより簡単に作れますよ」と解説してくれているのが、サルワカというサイトの特色であるといえます。

制作者自身が解説してくれている、と言うのがやはり大きな強みですので、もしブログ系のWebのUIUXの改善であるならば、SANGO及びサルワカを頼ってみるのも、一つの手かもしれません。

chot.design  

chot.designは、マイクロラーニング型オンラインデザイン学習サイトです。

ここでいうマイクロラーニング、という言葉に聞き覚えがない人も多いかと思いますので補足すると、マイクロラーニングとは、一講座数分で学べる、受けやすい講座形式のことを指します。

chot.designでは、主にWebデザインやUIUXデザインを主軸とした講座を多種多様に用意してあるのが特徴で、中にはWebディレクター用の講座もあるのがポイントです。

非作業者として発注する立場の方であれば、このディレクター講座はピッタリなのではないでしょうか?

また、口座だけでなく複数の情報共有コンテンツがあるのも嬉しい点で、マガジン配信、Q&A、他サイトすらリストにいれることが可能なブックマーク機能が搭載されています。

それだけでなく、『しごとさがし』という欄では、フリーランス、雇用情報などを得ることが出来ます。こちらも活用可能な場合があるかもしれません。

伝わるデザイン  

伝わるデザインは、資料作成に必要なデザインの知識を得られるノウハウサイトです。

このサイトは他のデザイナー向け、エンジニア向けのノウハウとは一風変わって、総合職的な観点から、資料作成に必要なデザインの知識が得られるサイトです。

その名の通り、『伝える』『伝わる』というところに主眼が置かれており、じょうほうをせいかくかつスムーズに他者に伝達するためのデザインメソッドを取りまとめています。

コンセプトとして『情報授受のバリアフリー』というものがあり、

・情報受信者の負担を減らし円滑な科学コミュニケーションが行なわれること

・すべての情報発信者が過小評価される(見た目で損をする)ことなく、真に内容によって評価されるようになること

・より多くの情報受信者が等しく情報を得ることができるように情報授受のバリアフリー化をすること

という三つの項目を目標に掲げています。

キーワードは『読みやすく、見やすく、バリアフリー』ということですので、もしUIUXの改善に当たって資料などの作成が必要となった場合は、この「伝わるデザイン」を活用してみてはいかがでしょうか。

ソシオメディア  

ソシオメディアとは、デザインコンサルティング会社『ソシオメディア』のブログです。
デザイナーから好評のブログを掲載しており、クオリティの高い、根本理解的な記事を多く掲載しています。

他のサイトと違うのは、初心者向けではない一方で、具体的というより抽象的で、何処か哲学チックな記事を掲載して
根本理解が出来ると評さいるという点です。

デザインとはつまり何なのか。デザインは何を達成していることで、その役目果たしているといえるのか。そういったことについて、中小レベルの高い記事を綴っています。

そのため、「専門用語が分からない」といったことは非デザイナーでも起こりにくく、逆に「このデザインはこの役割を果たしていないから、そこを適切に直してほしい」というような、指針としてのリテイク指示を出すためのノウハウを得られるサイトと言えるかもしれません。
れるクオリティの高いブログですので、一読してみてはいかがでしょうか。

まとめ  

以上が、WebサイトのUIUX改善に役立つサイトです。

では、最後に、ざっとおさらいしておきましょう。

Cocoda!
https://cocoda-design.com/

UI設計を学べる無料の学習サービスです。お題や素材が揃っているのでとっつきやすく、「デザイナーはどのようなことをしているのだろう」というのょ体感するのにおススメです。

Progate
https://prog-8.com/

初心者向けのプログラミング学習サイトです。実践的に学べるため、「プログラマはどんなことをしているのだろう」というのを体感するのにおススメです。

サルワカ
デザインに関するブログ
https://saruwakakun.com/

WebやUIUXに関して、デザイン、コーディングどちらの観点からも書いている図解説明マガジンです。SANGOというWordPress用のテーマの制作者が解説しているという特徴があります。

chot.design
https://chot.design/

マイクロラーニング型オンラインデザイン学習サイトです。一講座の時間が短く学びやすい上に、ディレクター向けという管理職的な講座もあります。

伝わるデザイン
https://tsutawarudesign.com/

資料作成に必要なデザインの知識を得られるノウハウサイトです。もし発注先に資料を作成する必要があれば、こちらのサイトがその助けになるかと思います。

ソシオメディア
https://www.sociomedia.co.jp/category/blog

デザインコンサルティング会社『ソシオメディア』のブログです。

デザインに対する抽象度の高い記事を掲載するサイトです。具体的な話が少ないので、根本理解が出来る一方で初心者でも読めてしまうという特徴があります。