Now Loading...

Web制作、
はじめました

創業令和四年

パーソナルロゴ かめ大福

Scroll

About

人と人とのご縁をつなぐ、Webサイトを作りたい。
その想いを実現するために、2023年8月より副業フリーランスとしてWeb制作を開始しました。

自画像

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

齋藤 寛史

Saito Hirofumi

応対可能な時間帯

平日
6:00~8:30 / 18:30~23:00
土日祝
6:00~23:00

SNS

プロフィール

2023年8月より、副業としてWeb制作に取り組んでいます。
作業時間は週30時間程度です。

本業ではITアウトソーシングサービスを提供する会社に所属。これまで複数の会社様の社内システム運用・保守業務を担ってきました。

関係者と積極的に対話を行い、認識を合わせながら円滑にプロジェクトを進めることが得意です。

Web制作でもクライアント様のニーズをしっかりとヒアリングし、ご要望を満たす成果物をご提供いたします

スキル

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からコーディングを実施。

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

  • サイトのイメージ画像1
  • サイトのイメージ画像2
  • サイトのイメージ画像3
  • サイトのイメージ画像4

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

クライアント
かめ大福
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

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