WEBの作り方なぜスタジオパプリカはコストパフォーマンスに優れているのか。その答えは、効率化を目指した社内開発環境にあります。XD”を使用Adobe社のデザインツールに関しては言うまでもなくデザイナーの必須ツールになります。XD」と使う理由は大きく以下の2点です。プロトタイプ作成やデザインスペックを公開できるため、クライアントに本物に近い形でデザインを共有できるその他にも画像の書き出しの面でもRetinaディスプレイに対応した2x画像の出力ができたりと非常に助かります。デザインの作成・修正などを行い、ゴールにたどり着くまでには非常に多くの時間とコストがかかります。それらに関する手間やすれ違いを軽減することで、より良いWebデザインをなるべく費用を抑えて作れるようにしております。HTML、PHPの記述にはテンプレートエンジン「Pug」を採用スタジオパプリカのWebマークアップには、2019年より一部を除きテンプレートエンジン「Pug」を採用しております。採用理由の大きくポイントとして、コードの見やすさが上げられます。コードが見やすいということは、そこにバグが入り込む余地が少なくなり、バグフィックスに取られる時間を削減することができます。閉じタグを記述する必要がないことや、ミックスインの作成で再利用性の高いコンテンツのコンポーネント化ができ、物理的な必要タイピング数も減少するためコード入力に関わる時間も削減することができました。ブランチの作成コミットを繰り返すため、万が一に途中で何か不具合がおきた場合に原因の特定にかかる時間が大幅に削減できます。同時に複数人が作業しても修正を上書きしてしまったり誤って削除してしまうようなことも防げるため、安心してコーディングに専念でき効率を上げることができます。NextによるCSSの記述CSSの管理は非常に厄介です。どこかに記述したスタイルが別のどこかのスタイルを打ち消してしまったりするからです。CSSはブラウザ毎に解釈が違っていたり独自仕様を持っていたりで、各ブラウザ毎にプレフィックスを記述するのは非常に手間が大きく、また記述漏れによるバグとも言える表示崩れに悩まされることは少なくありません。Prefix”などを採用しており、スタイルの記述を管理しやすく、そしてプレフィックスを自動生成することでミスの削減や効率の向上を行なっております。Nextを使用しております。Nextだと思っております。CSSによるcssの出力、javascriptのモジュール化などを行なっております。その他にも要所でGulpも併用し、jpegやpngからWebPへの変換なども一括で行えるようにしております。人の手では時間がかかることを自動化することにより、ミスを減らし、本来の業務であるクリエイティブな作業に多くの時間を割くことができます。