ウェブデザイナーもウェブコーディングを学ぶ必要がある

ウェブデザイナーもウェブコーディングを学ぶ必要がある

多くの場合、Web デザインが完成した後でデザイナーの無知が露呈し、批判されることがあります。彼らは、Web ページ コードを作成するという重労働をプログラマーに任せました。この現象は、Web 開発業界だけでなく、ソフトウェアおよびゲーム開発業界でも見られます。

厳しい現実としては、開発の進行はデザイナーによって停滞する可能性があるということです。最適な効率を追求するには、デザイナーは描くだけでなく、それを作る能力も必要です。この記事では、123WORDPRESS.COM が、デザイナーがコードの書き方を学ぶ必要がある理由をいくつか読者に紹介したいと思います。

現実的で実現可能なデザインを作る

最終製品がどのようになるか明確なアイデアがあれば、デザイナーはより現実的で実行可能なコンセプトを思いつくでしょう。開発プロセスの不可欠な部分として、デザイナーは、使いやすさ、Web アクセシビリティ、実装可能性を考慮しながら、デザインが Web メディアにスムーズに移行されるようにする役割を担っています。ユーザーフレンドリーな Web サイトは、閲覧順序が明確で簡潔であるだけでなく、邪魔になったり雑然としたりすることなく、ユーザーに必要なすべての情報を提供します。 Web レイアウトが実現可能かどうかを知る唯一の方法は、自分で Web ページを構築する方法を学ぶことです。

コミュニケーションを容易にする

設計と実装が分離されているほとんどすべての製品では、設計グループと実装グループが互いの期待に応えることは決してありません。特に、Web サイト、ソフトウェア、ゲームなどの無形の製品ではそれが当てはまります。これは通常、製品の期待と製品の実現可能性の間の妥協に帰着しますが、現時点ではこれを完璧に達成することは困難であると思われます。解決策としては、混乱、誤解、誤ったコミュニケーションを避けるために、デザイナーが自らデザインを実現しようと努めることです。

便利な反復開発プロセス

実際の設計は絶対的なものではありません。私が言いたいのは、デザインは柔軟で使いやすく、システムの本来の意味を歪めることなく、システムの技術的な制限に合わせて変更できるものでなければならないということです。これらの繰り返しの必要な変更は、元の設計者だけが行うことができます。開発者がデザインをデザイナーに持ち帰って変更を加えるよりも、デザイナー/開発者の方が効率的です。そして、デザイナーと開発者の間には摩擦が生じる可能性があり、実際に起こることがよくあります。

より良く、より調和のとれた結果

私はよく、ソフトウェア、ネットワーク、ゲーム開発をオーケストラに例え、デザイナーを作曲家、開発者を指揮者に例えるのが好きです。もしこの二人が同一人物だったらどうなるでしょうか?交響曲は、驚くほど魅力的で、純粋です!巨匠の傑作であるだけでなく、巨匠自らが監督も手掛けた作品です!

開発時間を短縮

デザイナーがプログラマーの役割も担うということは、デザインとコーディングの進行が同時ではないにしても、順次行われることを意味します。その結果、開発サイクルが短縮されます。効率を気にしない人がいるでしょうか?

デザイナーはより市場志向である

現代のデザイナーは、個人の価値を維持するために能力を向上させる必要があります。一連のスキルを持っているだけでは十分ではありません。デザイナー、フロントエンド開発者、記事執筆者、プロジェクトマネージャーなど、さまざまな肩書きを持つ必要があることがよくあります。

独自の設計を開発者の手中に放置するのではなく、実装することを学ぶことで、あなた自身の価値を高めることができます。結局のところ、履歴書にデザインやコーディングのスキルを記載しても損にはなりません。逆に、金融危機の時代においては、企業のリストラ(大量解雇を参照)とコスト削減により、解雇されることなく自分の重要性を強調することが可能です。

しかし、デザイナーがコーディングを学ぶべき理由はこれだけではありませんが、反対意見もいくつかあります。

ルーカス・マティスの物議を醸した記事「デザイナーはプログラマーではない」(注1)を引用

デザイナーが独自のデザインを実装する場合、クリーンなコードと優れたユーザー エクスペリエンスという 2 つの異なる目標によって制約されます。これら 2 つの目標は矛盾しています。独自のデザインを実装すると、必然的にコードの品質が損なわれ、インタラクション デザインに役立ちません。

独自のデザインを実装するデザイナーは、2 つの問題に直面します。優れた新しいアイデアによってコードが混乱してしまうことを認識しており、また、ユーザー エクスペリエンスを向上させると既存のコードが混乱してしまうことも認識しています。ユーザー エクスペリエンスは細部に大きく左右されるため、この 2 つは相反します。しかし、コードを乱雑にしたくないというユーザーの意向により、こうした細部は最終的に台無しになってしまいます。

これは、「Web 開発純粋主義者」がとる強硬な姿勢を的確に要約しています。彼らは古い考え方を持っており、設計と開発を明確に区別することを主張しています。当然ですが、デザイナーは人間のために作成し、開発者は機械のために作成します。したがって、UX デザイナーは可能な限り最高のユーザー インターフェイスを設計し、開発者が可能な限り最高のプログラミング決定を下せるようにする必要があります。これにはある程度の真実が含まれていますが、ユーザー インターフェイスに取り組んでいたとき、コードからインスピレーションを得ようとする私の努力は、しばしば失敗しました。一般的に、技術的およびユーザビリティ上の制限を念頭に置いて正しく理解しておくと役立ちます。

最後に

最終的には、開発中のプロジェクトの規模によって、デザイナーと開発者の役割が決まる場合があります。小規模なアプリケーションであればプロジェクトマネージャー(注2)で管理できますが、大規模なシステムでは必然的に異なる専門家が必要になります。

注1 Mathis-Lukas——「デザイナーはプログラマではない」——コードを無視する

注 2 Spolsky-Joel - 「デザイナー プログラマー」と呼ばれる役職について説明しています - 「プログラム マネージャーになる方法」 - Joel on Software

<<:  iframe ページパラメータの文字化けの問題について議論

>>:  CSS3 背景コントロールプロパティと色遷移を使用してグラデーション効果を実現します。

ブログ    

推薦する

LinuxシステムでのSystemC環境設定方法

以下はcentos7での設定方法ですsystemc ソース パッケージをダウンロード: System...

VirtualBox に CentOS、JDK、Hadoop をインストールする詳細なチュートリアル

目次1. 前提条件1.1 サポートされているプラ​​ットフォーム1.2 jdk および hadoop...

JS配列メソッドの詳細な説明

目次1. 元の配列が変更されます1. プッシュ(): 2.ポップ(): 3. シフト(): 4.un...

Docker を使用して pypi プライベート リポジトリを構築する方法

1. 建設1. htpasswd.txtファイルを準備するファイルには、パッケージを倉庫にアップロー...

MySQLを閉じることができない問題を解決する方法

mysql が閉じない場合の解決策:コンピュータのタスクバーを右クリックしてタスクマネージャーを開き...

無効と読み取り専用の機能と違い

1: readonly は、このコントロールをロックして、インターフェイス上で変更できないようにしま...

写真とテキストによる MySQL 8.0.21 インストール チュートリアル

1. ダウンロードリンクをダウンロードするダウンロードをクリックします。Oracle アカウントにロ...

Nginx におけるサーバーとロケーションのマッチングロジックの詳細な理解

サーバーマッチングロジックNginx は、リクエストを実行するサーバー ブロックを決定するときに、サ...

Reactソースコードにおけるビット演算について詳しく説明します

目次序文いくつかの一般的なビット操作ビットAND (&)ビットOR (|)ビット否定(~)マ...

Linux リモート コントロール Windows システム プログラム (3 つの方法)

場合によっては、Windows システム上のプログラムを Linux 上でリモートで実行する必要があ...

React Hooksを使用する際のよくある落とし穴

React Hooks は React 16.8 で導入された新しい機能で、クラスを使用せずに状態や...

JavaScript キャンバスはマウスの動きに合わせてボールを動かすことを実装します

この記事の例では、マウスに従ってボールを動かすjsの具体的なコードを参考までに共有しています。具体的...

MySQLのLIMIT文について詳しく説明します

目次質問サーバー層とストレージエンジン層LIMITって何ですか?何をするか?トゥカオ最近、Q&...

システム CD をマウントして yum ウェアハウスを構築する VMware 15.5 バージョンのグラフィック チュートリアル

1. CentOS 7 仮想マシンを開きます。 2. 仮想マシンにログインし、リストにないユーザー名...

Vue 親コンポーネントが子コンポーネント関数の実装を呼び出す

Vue親コンポーネントは子コンポーネントの関数を呼び出す親コンポーネントはイベントを通じて子コンポー...