Contact

Sho Yamaguchi

Web Design

Coding

Direction

Logo Design

Based in Miyagi.

Scroll Down

About

私のこと

私らしいデザインはありません

お客さまの真意を引き出し、

その本質を可視化すること

大切にしています。

There is no such thing as “my style” in design.
I value uncovering each client’s true intention
and visualizing its essence.

Services

できること

Web Design

ウェブデザイン

WordPressを中心としたホームページ・採用サイト・LP(ランディングページ)・ECサイトなどといった、
各種Webサイトのデザインを制作いたします。

対応可能範囲・使用アプリ

Figma

基本的にFigmaを使用してデザインしております。
使用する数字は4の倍数を意識し、理由のない奇数や小数点は使用しないことや、
パーツのコンポーネント化や余白・文字サイズをバリアブルとして設定するなどして、
実装時の負担軽減を考えながらデザインすることを心がけております。

使用期間
約1年半(2024年10月頃〜)
自己評価
0 1
2 3 4 5 6 7 8 9 10
基本的な操作はもちろん、効率化のための機能も使用することができます。しかし、ファイルやアセットの管理という点では必要最小限に留まっています。
Studio

ノーコードツールの使用も可能です。
Studio単体でのデザインではなく、一度FigmaでデザインしたものをプラグインでStudioに移行する方法で制作しております。

使用期間
約2年(2024年4月頃〜)
自己評価
0 1
2 3 4 5 6 7 8 9 10
CMSやカルーセルなどといったStudioの機能を使用した上で、通常のホームページやスマホ特化レイアウトでの制作など一通りの制作が可能です。
一方、カスタムヘッダーを活用した実装経験はありません。
Illustrator

メインビジュアルやバナー、Webサイトに表示するパーツ等の作成に使用しています。

使用期間
約4年(2022年4月頃〜)
自己評価
0 1
2 3 4 5 6 7 8 9 10
パスの編集や図形の作成、文字の装飾など、基本的な操作は問題なく行えます。画力はないため、イラストの制作はできません。
Photoshop

色味の変更や被写体の切り抜き、不用物の消去など、
使用する写真の編集のために使用しています。

使用期間
約4年(2022年4月頃〜)
自己評価
0 1
2 3 4 5 6 7 8 9 10
簡単な操作であれば問題なく行えますが、複雑な操作の際は検索しながら行うこともあります。
Adobe XD

Figmaに移行するまでは、XDでデザイン制作を行なっていました。

使用期間
約2年半(2022年4月頃〜2024年9月頃)
自己評価
0 1
2 3 4 5 6 7 8 9 10
Figma移行後はほとんど使用していませんが、制作にあたって困ることなく操作することは可能です。
Coding

コーディング

制作した/していただいたデザインを元に、実際に触れる形として実装いたします。

対応可能範囲・使用アプリ

WordPress

WordPress上でWebサイトを構築します。
投稿機能の組み込みやカスタム投稿・カスタムフィールドの設定、プラグインによるお問い合わせフォームの追加、会員機能の実装など多岐にわたって対応いたします。

自己評価
0 1
2 3 4 5 6 7 8 9 10
基本的な実装に加え、管理画面のカスタマイズも行えます。
ブロックエディターなど一部機能の活用はできていない点もありますが、
最近はヘッドレスCMSとしての使用を検証しています。
HTML/CSS/SCSS

BEM記法に沿ったHTML/CSSの記述を行います。

自己評価
0 1
2 3 4 5 6 7 8 9 10
Webサイトの制作において基本的な実装は問題なく行えます。
デバイス・ブラウザに関わらず表示されるようにすることも意識しています。
一方、アクセシビリティを踏まえた実装という点ではまだ至らないと認識しています。
JavaScript

jQueryやGSAP/ScrollTriggerを使用したアニメーション、Lenis.jsによる慣性スクロール、Swiper.jsによるスライダー、UIの動作実装などを中心とした記述を行います。

自己評価
0 1
2 3 4 5 6 7 8 9 10
アニメーションを中心とした実装は問題なく行えますが、アプリケーション的な記述はリファレンスやを確認したりAIを活用しながらの実装になります。
PHP

WordPressでのWebサイト構築にあたって必要となる範囲の記述を行います。

自己評価
0 1
2 3 4 5 6 7 8 9 10
WordPress制作の範囲内でPHPを使用できますが、本格的なバックエンド処理など、本来のPHPとしての使用はできていません。
Cursor

実装は全てCursorで行なっています。

使用期間
約1年9ヶ月(2024年5月頃〜)
自己評価
0 1
2 3 4 5 6 7 8 9 10
Cursor Tabによるコード補完機能やAgent機能など、基本機能を活用して普段から実装を行なっています。
Skillsなどの最新機能には知見がないですが、画像マッピングやルールファイルの作成、Figma MCPとの連携で実装期間を大幅に短縮することに成功しています。
Git/GitHub

コード編集内容の保存を目的として使用しています。

使用期間
約2年(2024年2月頃〜)
自己評価
0 1
2 3 4 5 6 7 8 9 10
保存用としての使用が主で、GitHub Actionsによるコミット時のオートデプロイを使用していますが、大人数での管理経験はありません。
また、CursorのGUIでプッシュ等を行なっています。

最近はAIを活用しながら、React + Next.jsによる簡単なWebアプリの制作や、
Astroを用いた高速なサイトの制作を検証しています。

Direction

ディレクション

制作にあたってのヒアリングや方向性決め、進行管理等を行います。

対応可能範囲・使用アプリ

Notion

議事録の作成のために使用しています。

Slack/Chatwork

クライアント様や制作会社様との連絡手段として使用しています。

スプレッドシート

進行管理のためのチェックシート等の作成・共有のために使用しています。

Logo Design

ロゴデザイン

会社や店舗、サービス等の顔となるロゴをデザインいたします。

対応可能範囲・使用アプリ

Illustrator

ロゴデザインは基本的に全てIllustratorで行なっています。

使用期間
約4年(2022年4月頃〜)
自己評価
0 1
2 3 4 5 6 7 8 9 10
パスの編集や図形の作成、文字の装飾など、基本的な操作は問題なく行えます。画力はないため、イラストの制作はできません。

For project inquiries or collaboration requests,
please feel free to contact me.

Flow

制作の流れ

01

ヒアリング

制作にあたって、要件定義や方向性の検討・情報収集のため、対面またはオンラインでのヒアリングを行わせていただきます。
(宮城県内であれば基本的に対面可、その他はご相談ください)

02

構成作成・ご提案

ヒアリングの内容をもとに、制作物の方向性や構成をご提案いたします。
また、制作にかかる費用やスケジュールも本段階でご提示いたしますので、ご希望があればご要望に応じた調整も承ります。

03

デザイン作成

ご提案内容をもとにデザインの作成を行います。
ワイヤーフレーム(下書き)→トップページデザイン→下層ページの順でデザインを作成し、各順でお客様にも確認いただきながら進行していきます。

04

コーディング

デザインを実際のWebサイトとして形にしていきます。
テストサーバーを使用し、お客様にも進行度合いを確認いただけるようにいたします。

05

公開・納品

テストサーバーにて実装したWebサイトに問題がなければ、本番環境への公開を行います。また、公開をもって納品とさせていただきます。

Profile

プロフィール

山口 笙

やまぐち しょう

大学4年生のとき、友達の誘いをきっかけに宮城県内のデザイン会社にアルバイトとして入社。
大学卒業後、そのまま正社員となり3年半勤務。
その後、独立し現在に至る。

経歴

1999.12

宮城県仙台市に生まれる

2018.03

明成高等学校 卒業

2018.04

東北工業大学 ライフデザイン学部 クリエイティブデザイン学科 入学

2021.03

株式会社Long Townにアルバイトとして入社

2022.03

東北工業大学 ライフデザイン学部 産業デザイン学科 卒業

2022.04

株式会社Long TownにWebデザイナーとして入社

2025.11

株式会社Long Townを退職

For project inquiries or collaboration requests,
please feel free to contact me.