松浦 聡志(まつうら そうし)のプロフィール
はじめまして松浦聡志(そうし)と申します。現在、22歳大学生で、webフリーランスエンジニアです。「学びこそ自分の人生をより良いものにする」をモットーに日々精進しています。難しい内容にぶつかっても自分のレベルアップのために試行錯誤して切り抜けてきました！
プログラミング
- web系プログラミング歴は、約1年。
- 独学で、HTML・CSS、JavaScript、jQuery、sass、PHP、WordPressを学習しました。
- adobeXD、PhotoShopなどのデザインデータを元にコーディングすることを得意としています。
- デザインの学習も少ししていたので、XD、PhotoShopの扱いは問題なく出来ます。
- レスポンシブ化が可能です。
- wordpressのカスタムフィールドで誰でも簡単に文章や画像を編集することが出来るサイト作成を得意としています。
- お問い合わせフォーム、スライダー、お知らせ機能などの導入も可能です。
デザインカンプからのコーディング作品
デザインカンプからのコーディング作品は、下記の通りです。
全てHTMLファイルからwordpressに組み込んでいます。
下記の作品は全てネット上にありましたAdobeXDのデザインカンプを元にコーディングしたものです(※デザインは自作ではありません)。PhotoShopからのコーディングも出来ます。
ユアコーディングの模写コーディング(トップページのみ)
ペーシック認証↓
- ユーザー: test
- パスワード: password
この模写の主な特徴
- HTMLファイルからwordpress化。
- レスポンシブ。
- jQueryによる動的な動きの導入。
- ヘッダーナビの固定(スクロールしても付いてくる)。
- swiperによるスライダーの作成。
- 新規投稿記事一覧の表示。
- contactform7によるお問い合わせフォーム。
クリスタの模写コーディング(ABOUT US、CONTACTの下層ページも作成)
ペーシック認証↓
- ユーザー: test
- パスワード: password
この模写の主な特徴
- HTMLファイルからwordpress化。
- レスポンシブ。
- ABOUT US、CONTACTの2種の下層ページも作成。
- ハンバーガーメニュー。
- Google MAPの導入。
デイトラの模写(NEWS、STORY、COMMENTS、CAST、INQUIRYの下層ページも作成)
ペーシック認証↓
- ユーザー: test
- パスワード: password
この模写の主な特徴
- HTMLファイルからwordpress化。
- レスポンシブ。
- jQueryによる動的な動きの導入。
- 下層ページであるNEWS、STORY、COMMENTS、CAST、INQUIRYも作成。
- カスタムフィールドを導入することで誰でも簡単に文章や画像を編集出来るようにしている(例:CASTの人物の画像)。
デザイン
- WEBデザイン歴3ヶ月。
- デイトラのWEBデザインコースで学習。
- figma、Photoshop、XDでデザイン可能。
自作デザイン作品
コーポレートサイト、LP、バナーを作成できます。
人材コンサル会社のコーポレートサイト(自作コーポレートサイト)
↑こちらをクリックすると全ページ確認できます。
このデザインの特徴
- きっちりした雰囲気を出すために、コンテンツのシルエットは、シンプルな四角にして、余白を揃えている。
- 色の種類は使い過ぎず、メインカラーは暗めにすることで、高級感、きっちり感を出している。
- ファーストビューの重要コンテンツ(ボタンなど)は、550pxまでに入れることで、現状主流のどの画面解像度でもちゃんと表示されるファーストビューに仕上げている。
- 40代以上の男性がターゲットなため、文字、ボタンは少し大きめに作成している。