得意とする開発
得意とする開発
業務システムのWebツール開発
エンタープライズ業務システムの、アーキテクチャの要件定義からUI設計、フロントエンドの実装まで行います。
特に業務システムでは、使う人のニーズに沿ったUIとメンテブルなコード設計が重要です。ピクセルグリッドでは、Jamstackをベースにした最適なアーキテクチャで、SvelteやPreactなどの運用や設計に合ったライブラリを選定し、長期に渡る運用を見越したフロントエンドの設計を行います。
APIを用意してある場合はもちろん、Algolia、GraphCMSなどニーズに合った既存サービスを使った構成で提案もできます。
取引会社
Webサービスのフロントエンド、管理画面開発
多くのユーザーが利用するWebアプリケーションのフロントエンド設計は、ピクセルグリッドが得意とする分野の一つです。規模に合わせ、JamstackをベースにしたアーキテクチャでSvelteやPreactなど最適なライブラリを選定し、設計します。
新たにAPIを合わせて開発する場合、フロントエンドから扱いやすいAPI設計をサポートします。Firebaseなどを利用したリアルタイムで動作するフロントエンド実装にも対応できます。
開発事例
SARF CMS
エイベックス・エンタテインメント株式会社が提供する音声AR体験"SARF"。そのコンテンツを管理する"SARF CMS"の情報設計、画面UI設計、画面デザインとフロントエンド開発を担当。Amazon Cognitoの認証に対応したSPAをNuxt.jsで実装した。また、Netlifyを利用したプレビュー環境を構築し、開発時のスムーズな状況共有とコミュニケーションを実現した。
あきばれホームページ
HTMLがわからない人でも自由にコンテンツを制御できる、CMS管理画面のGUI実装を担当。データ管理はすべてAPIを通して行うSingle Page Application。CoffeeScriptとBackbone.jsで複数人開発をスムーズにできるように設計した。
WebグラフィカルUIツール開発
画像編集ツールや、ビジュアルで操作して試せるシミュレーターなど、SVG、Canvas、WebGLを使ったグラフィカルなUIを持つWebサービスが多く作られるようになりました。
ピクセルグリッドでは、複雑な図形や、3Dの仕組みを使った、独自のWebグラフィカルUIツールの設計、開発を行っています。PCはもちろん、スマートフォンやタブレットでも問題なく動作するWebツールを開発できます。
開発事例
VRoid Hub
3Dモデルデータをアップロードするだけで、キャラクターが動くプロフィールページが作れるpixivのサービス。VRMのWebGL実装とそのビューア部分を担当。
ブラウザ拡張の開発
いくつかのWebサービスでは他のサイトを閲覧時でも、自社サービスの情報を呼び出したり、機能を呼び出せるブラウザ拡張機能を提供しています。ピクセルグリッドではブラウザ拡張機能の作成にも対応しています。
Webサービスから通知を受け取るようにしたり、特定のWebサイトやサービスの拡張するといったことも可能です。ブラウザ拡張でお困りの場合はご相談ください。
開発事例
検索結果に情報を追加する拡張
10万件のデータを元に、Google等の検索結果で関連するウェブサイトがあれば、情報を追加表示するChrome拡張を開発。バックエンドとしてAlgoliaを提案し、高速で利用者が増えてもスケールできる仕組みで構築した。
フロントエンドのパフォーマンス調整
Webアプリケーションのパフォーマンスは、ユーザー体験に多大な影響を与えます。パフォーマンスの悪いアプリケーションは、それ以外の機能の使い勝手やUIがどんなに良いものだったとしても、全体の評価を著しく低下させてしまいます。
ピクセルグリッドでは、フロントエンドのパフォーマンス調整を行うことができます。パフォーマンスに問題を抱えるWebサイトやアプリケーションの、ボトルネックとなっている箇所を洗い出し、適切な改善方法をご提案させていただきます。
開発事例
リリースのためのパフォーマンス調整
開発完了後、パフォーマンスが悪くリリースできなくなっていたプロジェクトのパフォーマンス調査と改善。フロントエンドの描画でボトルネックとなっていた箇所を特定し、その部分の改善を行った。その結果、対象の端末において、十分なパフォーマンスになり無事リリースできた。
EC、メディア、コーポレートサイトのJamstack開発
ECサイト、メディアサイト、コーポレートサイトをJamstackで開発すると、高速でセキュリティ上有利なサイトとして公開できます。
サーバーサイドのCMSを中心とした構成だと、アクセス増に対応するため、複雑なアーキテクチャとなっている場合があります。事前に構築・配信が可能なコンテンツを生成しておくJamstackでリニューアルすることで、シンプルなアーキテクチャで改善できます。
ピクセルグリッドでは、コンテンツにあったサービスを選定、提案し、ランニングコストを抑えられるアーキテクチャで実装まで行えます。
開発事例
セゾンカード
リニューアル時のフロントエンド開発を担当。EleventyとmicroCMSによるJamstack構成で、情報を整理し更新しやすく、高速でセキュリティを考慮したWebサイトを実現した。インタラクティブなコンテンツにSvelteを採用し、パフォーマンスには特に気を使った構成とした。
CodeGrid
自社で執筆・開発・運営をする、フロントエンドに関わる人々のためのオンラインメディアCodeGrid。そのリニューアル時の開発をJamstackにて行った。Netlify + Eleventy + GraphCMSという構成で、約4000ページのコンテンツを事前に生成してCDN配信することで、高速でセキュリティ上有利なメディアサイトを実現した。
NIKON Imaging Products
マルチデバイス対応／リニューアル時のフロントエンド開発を担当。汎用性の高いテンプレートを設計と実装を行った。1テンプレートによるマルチデバイスに対応したことにより、運用コストの削減、および更新性の向上を図った。
Jamstackで解決したいプロジェクトがあれば、
技術選定の前に気軽にご相談ください。