Now Loading...

Web制作、
はじめました

創業令和四年

パーソナルロゴ かめ大福

Scroll

About

人と人とのご縁をつなぐ、Webサイトを作成したい。 これが私のMissionです。

自画像

かめ大福代表/Webクリエイター

齋藤 寛史

Saito Hirofumi

応対可能な時間帯

平日/土日祝
6:30～21:30

SNS

プロフィール

フリーランスのWebクリエイターで現在はコーディングの代行、サイト構築を主に行っております。

多くのご依頼をいただくようになったことから2025年1月にフリーランスとして独立しました。
これまでクライアントからは納品物の品質や迅速な対応が高く評価され、リピートのご依頼も多くいただいております。

作業時間：週40時間程度
（最大60時間）

スキル

HTML
SEOに強い、ウェブ標準に準拠したコーディングが可能です。
CSS
モダンな機能を活用した自在なレイアウトが可能です。
JavaScript
素のJSでWebサイトに複雑なアニメーション設定、表示の制御を行えます。
WordPress
ユーザーが運用しやすい、オリジナルテーマの構築ができます。
Figma
デザインカンプからのコーディング、静的なデザインの作成が可能です。

Service

  • コーディング

    デザイナー様の意図を汲み取り、デザインの魅力を引き出すWebサイトを作成します。
    また、現行の標準仕様に準拠した保守性の高いコードをご提供いたします。

  • Webサイト制作

    クライアント様の「メッセージ」「想い」を多くの人に届けることを意識して、利用しやすいランディングページやホームページをデザイン・制作します。

  • Wordpress対応

    Wordpressを使った新規ホームページやブログの導入・保守対応や、既存のWEBサイトのWordpress化の対応を承ります。

Works

※作品・実績は今後順次掲載して参ります。

ポートフォリオサイト

クライアント
かめ大福
担当
サイトデザイン / ロゴデザイン / HTML・CSS / JavaScript
制作期間
合計：30日(約60時間)
デザイン：9日
HTML・CSSコーディング：7日
JavaScriptコーディング：14日

当サイトです。 個人では初めてデザインからコーディングまでの全工程を行いました。

JavaScriptは自身の知識向上を目的として、既存のライブラリやフレームワークを用いずに1からコーディングを実施。

アニメーションは見た目の面白さと利用者にストレスを感じさせないことを両立できるよう、動作時間・タイミングの試行錯誤を行いました。

  • サイトのイメージ画像１
  • サイトのイメージ画像２
  • サイトのイメージ画像３
  • サイトのイメージ画像４

架空のカフェレストランの公式サイト

クライアント
かめ大福
Webサイトへ
担当
サイトデザイン / ロゴデザイン / HTML・CSS / JavaScript /
WordPressテーマ作成
制作期間
合計：76日(約200時間)
デザイン：22日
コーディング：25日
Javascript：14日
WordPress化：15日

Wordpressを使用したカフェレストランの公式サイトをデザインからサーバーアップまで対応する想定で作成しました。

デザイン
Figmaで作成。
「ふわふわのパンケーキが主力商品」「メインターゲットは20～40代の女性」「サイトからの予約による利用客の増加」という設定で、 円形のモチーフをメインに使用して色調は彩度を少し抑えた落ち着いた色合いにしました。
HTML/CSS
CSS設計（FLOCSS）を意識したコーディングに挑戦。結果、今回の制作ではかなり時間を要してしまいました。
自身のスタイリングの定型を整えて今後の制作時間の短縮に努めます。
JavaScript
素のJavaScriptでモーダル、スライダー、スクロールアニメーション、予約フォームの日時反映の制御などの制御を制作。
クラスを用いて再利用性・保守性の高いコードにすることを心がけました。
アニメーションはユーザーがくどさを感じず、次の画面を開きたくなるようなテンポの良さを意識しました。
WordPress
オリジナルテーマで作成。
ユーザーが実際にサイトを運用していくことを意識し、トップページやフードメニューなどを簡単に更新ができるようにしました。
  • サイトのイメージ画像
  • サイトのイメージ画像
  • サイトのイメージ画像
  • サイトのイメージ画像

日本地図ルーレット

クライアント
かめ大福
Webサイトへ
担当
UIデザイン / HTML・CSS / JavaScript
制作期間
合計：3日(約5時間)

Web制作のコミュニティでの雑談会で着想を得て息抜きに作成したお遊びWebアプリ。
SVGの画像のIDとチェックボックスのリストの情報をリンクさせる形で処理を組んでいます。

  • サイトのイメージ画像

Clamp Code Generator

クライアント
かめ大福
Webサイトへ
担当
UIデザイン / HTML・CSS / JavaScript
制作期間
合計：30日(約20時間)

レスポンシブ対応で頻繁に使用するclamp関数のコードを簡単に生成するためツールです。

制作コンセプトはコーダー視点で使いやすいツールであること。

例として、既存の生成ツールは関数のコードを作った後、ビューポートをどのように変更させる場合の関数かが分からなくなる難点がありましたので、本ツールは生成元の情報もCSSのコメントとして出力できるようにしています。

他にも、プレビュー、ライト・ダークモードの切替、二言語（日本語/英語）の切替など実験的な機能を追加しました。

処理はCSSとJavaScriptで実装しています。
GitHubにソースを掲載していますので、ご興味ある方はご参照ください。

  • サイトのイメージ画像
  • サイトのイメージ画像

Contact

ご質問・ご相談などがございましたら下記フォームよりお問い合わせください。
お気軽にご連絡いただけますと幸いです。

userName 様

お問い合わせいただき、ありがとうございます。
内容を確認の上、以下のメールアドレスへご連絡させていただきます。