会場に到着すると、すでにたくさんの人が集まっており、まずは8グループに分かれて自己紹介からスタート。
乾杯の合図とともに、チームビルディング研修が始まりました！

最初のイベントは“薪割り”！

最初のイベントは、なんと薪割り。

しかもトップバッターは、まさかのうちの社長！
見事に薪を割る姿に会場も盛り上がり、その後は各チーム順番に挑戦していきました。

もちろん自分もチャレンジしましたが、これが想像以上に難しい…。
斧自体がかなり重たく、真っ直ぐ頭上まで持ち上げ続けるだけでも一苦労でした。

普段なかなか体験できないことだったので、とても新鮮でした！

お待ちかねのBBQスタート！

薪割りのあとは、いよいよBBQ！

ウインナーから分厚い豚バラまで、たくさんのお肉がテーブルに並び、各自好きなように焼いて楽しみました。

どれを食べても本当に美味しく、自然と会話も盛り上がります。

さらに飲み放題も同時にスタートし、みんな一斉にドリンクカウンターへ（笑）

美味しいご飯とお酒で、一気に会場の空気も打ち解けていきました。

本格ピザ作りにも挑戦！

今回のイベントでは、なんとピザ作り体験もありました！

先生に教えてもらいながら、生地を伸ばすところからスタート。
自分たちでトッピングをして、本格的なピザ窯で焼き上げます。

このピザ窯、温度はなんと約300度まで上がるそうで、ピザはわずか1分半ほどで完成！

焼きたてのピザは香ばしくて最高でした。

yep恒例！？白熱のモルック大会

みんなのお腹が満たされたあとは、yepでは恒例（？）のモルック大会！

今回はトーナメント形式で行われ、

1位：3,000円
2位：2,000円
3位：1,000円
のAmazonギフト券が用意されていました。

各チームかなり本気モードで戦っていましたが、なんと自分たちのチームは準優勝！

無事にAmazonギフト券をゲットすることができました！

やはり経験者は強いのでしょうか…？（笑）

最後はスモアで締めくくり

イベントの最後は、マシュマロを焼いてスモア作り。

自分で作るスモアは格別で、BBQの締めにぴったりでした。

会場は海の近くということもあり、とても開放感のあるロケーション。

初参加でしたが、これからお世話になる皆さんとたくさん交流することができ、

これからお世話になる身としては最高の挨拶の場になったと思います。

もし機会があれば他のyep社員もぜひ参加できればと思いました！

The post 初参加！新木場公園でのチームビルディングBBQに参加してきました！ first appeared on 株式会社yep.

私事ですが、令和7年度第4回ウェブデザイン技能検定2級に合格いたしました！
今回は受検の振り返りも兼ねて、受検のきっかけや学習方法などについて書いていこうと思います。

ウェブデザイン技能検定とは？

ウェブデザイン技能検定とは、Web制作に関する知識や技能を評価する、厚生労働省認定の国家検定です。
ウェブデザインに関する資格の中では、現状唯一の国家検定となっています。

本検定は3段階の等級に分かれており、3級は基礎的な知識、2級は実務レベルの知識、1級は高度な専門知識が求められます。
また、合格率は3級が60〜70％、2級が30〜40％、1級が10〜20％とされており、等級が上がるほど難易度も高くなります。

各等級には受検資格の条件があり、私が受検した2級には「3級の技能検定合格」か「2年以上の実務経験」が必要でした。
幸い私は実務経験があったため、3級を飛ばして2級から受検しています。

受検のきっかけ

昨年、デザイン・DX事業部でウェブデザイン技能検定2級の学習に取り組む機会があり、それがこの検定を知るきっかけでした。
業務時間内に毎日学習時間が設けられ、最終的には模擬テストに挑戦しましたが、合格点に届かず不合格に終わりました。

もともと私は実務経験を重視するタイプで、資格にはあまり関心がありませんでした。
そのため、模擬テストについても「軽く過去問を解けば何とかなるだろう」と慢心していた部分があったと思います。
しかし、不合格という結果を受けて自分の未熟さを痛感し、改めてウェブデザイン技能検定2級を受検しようと決意しました。

また、yepには会社指定の資格を取得すると資格手当が支給される制度があり、その対象にウェブデザイン技能検定が含まれていたことも、受検を決意した理由の一つです。

学習について

決意したはいいものの、忙しさを言い訳にずるずると先延ばしにしてしまい、実際に自主学習に取り組み始めたのは試験の1ヶ月半前くらいからでした。

検定の受検は事業部での取り組みとは別の自主的なものだったため、学習は余暇の時間を使っています。
帰宅後に子どもの寝かしつけなどを済ませて、毎日22時頃から1〜2時間ほど学習時間を確保していました。
休日も日中は家事や育児があったため、子どもがお昼寝している時間や、夜寝た後の時間を学習にあてていました。
とはいえ、日によってはサボってしまうこともあり、トータルの学習時間は50時間ほどだったと思います。

また、公式サイトにて参考書籍として紹介されていた「ウェブデザイン技能検定2級ガイドブック」を勉強教材に使用しました。
こちらのガイドブックには参考書としての役割の他に、オンラインで練習問題や模擬試験にチャレンジできるネットチャレンジというものがあり、気が向いた時に練習問題にチャレンジできるのでかなり重宝しました。

学科の学習

私はテキストを読むだけでは内容が頭に入りにくいタイプのため、ガイドブックの内容を自分の言葉で書き起こし、不明点を調べて補足したものを非公開のNotionにまとめていました。
 

ガイドブックの章ごとにNotionへ整理し、各章を終えるたびに「ネットチャレンジ」で該当範囲の問題を解く、という流れで学習を進め、その中で間違えた問題や自信のない問題は改めて調べ、再度Notionにまとめる、というサイクルを繰り返すことで、内容の定着を図りました。

ガイドブックの学習を終えた後は、公式サイトに掲載されている過去問にも取り組み、同様に間違えた問題や自信のない問題を調べてNotionに整理しました。

効率的とは言い難い、泥臭い勉強方法だったと自分でも思いますが、今回の受検は合格そのものよりもスキルアップを目的としていたため、その点においては一定の成果を得られたのではないかと感じています。
 

実技の学習

実技についてはあまり重点的な対策は行わず、過去問に一度取り組んだほか、ガイドブックの解説を確認する程度にとどめました。
出題内容は大きく変わらない傾向にあったため、GIF形式のアニメーションをPhotoshopで作成する方法とJavaScriptの部分のみ対策し、それ以外はこれまでの知識で対応できたという印象です。

試験本番

試験当日は夫に育児を任せ、緊張でカチコチになりながら会場へ向かいました。
道中はひたすらNotionの内容を読み返していたのですが、ちょうどその部分が出題されたため、最後まで粘ってよかったと感じています。
自己採点ではギリギリ合格点といった正答率だったため、この最後の粘りがなければ、もしかすると合格できていなかったかもしれません。

終わりに

今回の受検を通して、自分の知識やスキルの不足を改めて実感するとともに、基礎から学び直すことの大切さを学びました。
また、結果だけでなく、学習の過程そのものが大きな成長につながったと感じています。
今後も継続して知識のアップデートを行い、実務に還元できるよう取り組んでいきたいと思います。

最後までお読みいただき、ありがとうございました！
 

The post 【資格取得】ウェブデザイン技能検定2級に合格しました first appeared on 株式会社yep.

主な工程

1. 市場調査・サイトマップ・ワイヤーフレーム
2. デザイン
3. コーディング
4. WordPress設定

1. 市場調査・サイトマップ・ワイヤーフレーム

市場調査では競合となるアウトドアグッズを販売しているECサイトを調べ、どんな特徴があるか、ページ構成やメニューなど参考にできる部分を探します。

サイトマップは市場調査で調べた内容から、今回のサイトのページや構成を考えていきます。

ワイヤーフレームは各ページにどんな要素をどの配置で置くかを決めるものです。
特にトップページはお客様が訪れた時にどんな情報がどこにあると良いのか考える必要があり難しかったです。

2. デザイン

デザインではサイトのコンセプトや使用するカラーを決定し、ワイヤーフレームを元にサイトの見た目を作っていきます。

実際に画像を入れるとワイヤーフレームで見た時よりもごちゃごちゃして見えたり、商品を目立たせようとシンプルにしすぎてコンセプトを見失ったり、たくさん試行錯誤しました。

スライドバナーで使用するバナー画像も作成しました。

デザインが完成したら、クライアントにデザインを説明する デザイン提案書 を作ります。

デザインのコンセプトや、そのデザインにした理由など、デザインについて詳しくないクライアントに伝わるよう意識して書いていきます。

専門学校の授業では説明する相手はデザインに詳しい先生だったので、どう見せれば伝わるのか考えるのは初めてで勉強になりました。

3. コーディング

HTML / css / JavaScript を使って作ったデザインを起こしていきます。

コーディング中は定期的にフィードバックをいただき、今まで意識できていなかったHTMLのルールや、便利なcss、SEO対策についてなど教えていただきました。

一番苦戦したのがJavaScript。
インターンや専門学校で触れる機会はあったのですが、苦手意識が強くありました。
今回だと、スライドバナー / ヘッダーメニューの展開 / 絞り込みの開閉 / 画像の拡大表示 などをJavaScriptを使用して実装しました。
調べたコードをコピペしたり、教えていただいたりしながらなんとか動かすことができました。

コーディング作業を通して感じたことは、仕事としてコーディングをする上でわかりやすいコードを書くことが大事ということです。
命名規則を決めたり、なるべくシンプルに描ける方法を模索したり、わかりやすいコードを書くことで、他の人と一緒にコーディングしやすくなったり保守がしやすくなります。
今まではコードがぐちゃぐちゃでも自分がわかればいいや〜なんて思っている節があったので、改善していきたいです。

4. WordPress設定

コーディングした内容をWordPressのページにするべくテーマを自作します。
テーマ自作するのは初めてでしたが、インターンで既に完成しているオリジナルのテーマを編集する機会があったので完成形のイメージがあったのでなんとか作れました。

主にWordPressの機能を使用した部分は、お知らせ と お問い合わせフォーム です。

お知らせ

お知らせ用のカスタム投稿を作成し、管理画面から追加できるようにしました。
新着順に3件トップページに表示される設定も無事実装できました。

お問い合わせフォーム

Contact Form 7 というプラグインを使用しました。

機能自体はすぐに実装できました。が、デザインに合わせて調整をするのがとても大変でした。

具体的にどんな対応をしたかというと、項目ごとに未入力時のエラーメッセージを変更しました。
Contact Form 7で用意されているエラーメッセージは全項目共通で表示されます。
それをJavaScriptで上書きするというのを行いました。

自分ではどうにもできず、ほとんど教えてもらった形ですがなんとか実装できました。

他にはセキュリティ設定やSEOの設定などを行い完成です。

研修発表

研修発表では最終課題の内容を会社の皆さんに発表しました。
とても緊張しましたが、無事研修が終わる達成感がありました。

研修が終わり、現在はOJT期間に入り実務に励んでおります。
早く一人前のWEBデザイナーになれるように頑張ります！

The post 新卒WEBデザイナー研修記 〜ECサイトデザイン WordPress使用〜 first appeared on 株式会社yep.

以前は、美容系会社のWEBデザイナーとして働いていましたが、
2024年3月から「yepにてフロントエンドエンジニア」としてステップアップすることになりました。

といっても、デザイナーの頃はWordPressの自社サイトを更新したり、LPを作ったりと、
ゴリゴリにエンジニア作業をしてた訳ではないので、
エンジニア業界を知る意味も含めて、新人研修を受けさせていただきました。

そこで、この記事では研修期間における

• 制作物
• 研修期間（２ヶ月）で取り組んだ課題
• デザイン課題
• エンジニア課題
• 研修を通して得た学び

についてお伝えできればいいなと思います。

→フロントエンドエンジニアなので、
デザイン面と実装面の両方を研修内容に含んでいます。

また、もしこれからフロントエンドエンジニアになりたい！って人がいたら、
１つの参考にしてもらえたら嬉しいです。

では早速どうぞ！( ^ω^ ) /

制作するもの

PHPとDB（データベース）を利用した、フォーム入力サイトを作ることになりました。

元々HTML、CSSはある程度仕事で使っていたのですが、
PHPやJavascriptはそこまで精通してなかったので、
この機会にガッツリサイト制作に取り組むことに。

研修期間（２ヶ月）で取り組んだ課題

研修で実施した内容はこちら↓

それぞれの概要は、

【①市場調査】
サービスをリリースする上で競合サイトをリサーチ

【②ワイヤーフレーム（提案書）】
市場調査やヒアリングを元にサイトの要素・機能をまとめる
※この際に完成イメージを明確に持つのが大事

【③デザインカンプ】
ワイヤーフレームで網羅したサイトの必要要素にデザインを充てていく

【④デザイン提案書】
なぜこのデザインにしたのか？の根拠を踏まえ作成

【⑤XDプロトタイプ】
XDで実際のサイトの動きを付け、実装イメージに相違がないか確認

【⑥コーディング（HTML、CC、Javascript）】
静的ページをまずは制作。これを元にPHP・DB（mySQL）に紐付けて動的なページを作ります

【⑦コーディング（PHP）】
静的ページをPHP化していきます

【⑧DB連携（登録のみ）】
今回のサービスでは、入力した項目を新規追加する機能のみ実装します

【⑨PHP、Javascriptによるバリデーション機能】
入力フォームにエラーがあった場合、エラー文言を出してユーザーに知らせる機能です

【⑩テスト項目洗い出し（正常系、異常系）、テスト】
制作したサイトがうまく動作するかテストしていきます

と、本当に１から全てサービスを制作していく研修になりました。

ここからは、

ーーーーーーーーーーーーー

①〜⑤：デザイン課題
⑥〜⑩：エンジニア課題

ーーーーーーーーーーーーー

として、掘り下げていきたいと思います！

デザイン課題

①市場調査

競合サイトを調査して、「どんな機能があるか」「デザインの特徴」をまとめます。

機能面では、入力フォームの実装があるので

・フォームに必要な項目
・フォーカスした時の動き
・エラーの時の動き
・フォームの幅・高さ、余白、フォントサイズ

など、細かく調べていきました。

項目は、クライアントがどんな内容を取得したいかヒアリング時にすり合わせをしましたが、
「競合ではこんな項目がありましたよ〜」と、こちらから提案することもありました。

デザイン面では、「幅・高さ、余白、フォントサイズ」は他のページとの兼ね合いもあるので、
ここはワイヤーフレームを制作する時にまとめることにしました。

②ワイヤーフレーム（提案書）

実装するページは３ページになりました。
それぞれのページの目的は、

【トップページ】

目的：どんなサービスなのかを訴求し、このサービスに興味を持ってもらうためのページ。
→離脱防止のため長くならないように

【入力ページ】

目的：必要な情報を入力するページ。

機能：
・Javascript、PHPのバリデーション
・DBへの登録
・表示ページへ遷移（入力エラーの場合は遷移しない）

【表示ページ】

目的：入力内容が表示されるページ。

機能：
・入力内容の表示
・SNSシェアボタン
・生成完了を伝えるアニメーション
・直接URLにアクセスした場合は、入力ページへリダイレクト

また、ワイヤーフレームはとっても大事で、
ここを曖昧に作ってしまうと、後のデザインやコーディングで苦労します（笑）。

実際に、今回の研修でデザインやコーディングに進んだけれど、
結局ワイヤーフレームを直さないといけないことが発生しました。

この時点で、完成イメージを明確に持って、
デザインやコーディングに入らないと自分もメンバーも苦労してしまうことになるので、
そのことを改めて実感したフェーズでした。

ーーーーーーーーーーーーーーーーーーーーーー

– ポイント –

ワイヤーフレームで完成イメージを明確にして、
デザインやコーディングに入る。

ーーーーーーーーーーーーーーーーーーーーーー

ということで気を取り直して（笑）、
ワイヤーフレームに対してデザインを作っていきます！

③デザインカンプ

このフェーズでデザインを作り込みます。

デザインはあくまでワイヤーフレームに対して肉付けしていくのであり、
ワイヤーフレームからかけ離れたデザイン（配置が異なる・余白が合っていないetc…）、
クライアントにワイヤーフレームを確認してもらった意味がなくなってしまうので。

ーーーーーーーーーーーーーーーーーーーーーー

– ポイント –

デザインはワイヤーフレームで決まった要素の、
配置（大きさ・余白）などに沿って肉付けしていく

ーーーーーーーーーーーーーーーーーーーーーー

④デザイン提案書

このフェーズでは、
サイトのイメージをクライアントとマッチさせることが
改めて大変であることを学びました。

今回は２案作成することになり、
提案内容をまとめて選んでもらうフローで行いました。

⑤XDプロトタイプ

XDのプロトタイプ機能とは、

ブラウザ上で実際のサイトのようにボタンをクリックしたらページ遷移する、などの
動きをつけることができる機能です。

今回の課題では、「入力項目を追加」をクリックすることで
入力欄を動的に増やす動きをXD上で再現します。

ただ、XDでも表現の限界はあるので、

「インタラクション」項目で、
タップ＞トランジション＞移動先に案件が増えたデザインのアートボードを選択

にすることで、イメージの共有を行いました。

テキストだけでは伝えきれない内容を、
プロトタイプで表現することで認識相違がないようにします。

ーーーーーーーーーーーーーーーーーーーーーー

– ポイント –

XDのプロトタイプは、クライアントやメンバーとの
イメージ相違がないように共有する。
ただし、実際のサイトの動きに完全に合わせることはできないので、
表現できないものは補足したり、工夫が若干必要。

ーーーーーーーーーーーーーーーーーーーーーー

エンジニア課題

ここから先は、エンジニア課題です！

デザインやXDの共有イメージを元に、コーディングを進めていきます。

「カタカタカタ…」

⑥コーディング（HTML、CC、Javascript）

まずはPHPやDBとは関係なく、
静的ページとしてコーディングしサイト完成を目指していきます。

PHPでは、foreach文などの繰り返し処理を使って、
入力できる項目を増やしたりします。

ただ、その実装をする前に、
HTML、CSS、Javascriptを使って実装をまずは行います。
（基本的な実装と、アニメーションや項目の増減の作業でした）
 

以下、実装内容です。

【トップページ】

・ボタンサイズ
→Googleガイドラインを参考にして作成
・使い方のダイジェスト動画
→MacのQuickTime Playerを使って動画キャプチャを撮影
・fadeInアニメーション
→スクロールに合わせてふわっと表示させる（jQuery）
・SNSシェア機能
→各SNSツールに記事がシェアできるようボタンを設置
・URLをコピーボタン
→クリックすると、表示された記事のURLがコピーされる

【入力ページ】

・formタグ内で、必要項目をinputなどで制作
→JSでバリデーションを実装するので、HTMLでは必須項目にrequiredはなし
・追加、削除になる項目にアニメーションをつける
→瞬時に切り替わると実行されたかが視認しずらいため（jQuery）
・配色
→入力に集中してもらうため、背景色は白に
・アニメーション
→追加、削除以外にアニメーションは実装なし（入力集中！）
・余白
→input内にしっかり取ることで入力しやすい設計に
・リアルタイムのバリデーション
→入力エラーがある場合、入力項目を移動した時点で枠外にエラー表示を出す

【表示ページ】

・必要最低限のレイアウトに
→ジャムの法則みたいな
・完了したアニメーション
→表示ページへ遷移したら、完了したことがわかる動きを実装

入力ページの増減項目の管理

正直、これが一番大変でした。。。

最終的にDBと連携してデータの登録があるので、
その管理を「何の項目の、何番目に入力されたものか？」を
番号を付与して実装することにしました。

最初はJSで追加項目をカウントする変数を作り、
それを使ってフォームにidやname属性を付与していましたが、

この方法だと削除した項目以外の順番（インデックス番号）がずれてしまいます。

結果的に、追加、削除する項目においては、
対象の全ての要素を取得（querySelectorAll）して、
インデックス番号を１から振り分ける処理を行いました。

そうすることで、削除されたものも含め、
動的にJSで番号管理ができるようになりました。

また、CSSもそうなのですが、
クラスの命名規則や、JSではidはなるべく指定せず記述することを学びました。

その理由は、PHPにする際にidを付与して記述することがあり、
バッティングしてしまうことがあるようです。

なので、なるべくならCSSのクラスを指定して、
それに対して機能を実装していくようにすると、
バックエンドのエンジニアの方にデータを共有する際に
スムーズに受け渡しができます。

エンジニア職ではなかったので、ここまで気にかけなかったのですが、
理由としても納得できたところなので、
私もこれからはCSSを指定して動きをつけていけたらと思います！

ーーーーーーーーーーーーーーーーーーーーーー

– ポイント –

クラスの命名規則を分かりやすく。
JSでは、idで指定せず、CSSのクラスなどで指定する方が
バックエンドへデータを渡す時にもスムーズになる。

ーーーーーーーーーーーーーーーーーーーーーー

⑦コーディング（PHP）

先ほどのデータを、今度はPHP化させます。

・繰り返し処理
・入力がない場合の処理
・入力があった場合の処理（POST情報がある場合）
・バリデーション
・DB登録

が主な実装内容です。

具体的な実装の流れはこちら↓

ーーーーーーーーーーーーーーーーーーーーーー

if(POST情報がある場合){

　バリデーション関数定義
　バリデーション実行
　　エラー情報の表示、POST情報をフォームに再表示

　if(エラーがない場合){
　　①SESSIONに保存
　　②DBへ保存

　　“`
　　トランザクション開始
　　内容がOKなら、コミット
　　“`
　　③表示ページへリダイレクト
　}
}

POSTがない場合：入力フォームの表示（初期表示）

ーーーーーーーーーーーーーーーーーーーーーー

正直、自分一人ではこの考え方に辿り着けなかったため、
先輩のエンジニアの方に助力をいただいて、
ようやく実装できた！って感じでした。

ポイントは、DB登録をする際に、

・１つもエラーがない場合に、登録される
・１つエラーがあったら、何も登録されない

と、２択の実装を行ったことです（トランザクション）。

ーーーーーーーーーーーーーーーーーーーーーー

– ポイント –

今回のサイトでは、DB登録をする際に、

・１つもエラーがない場合に、登録される
・１つエラーがあったら、何も登録されない

と、２択の実装を行った（トランザクション）。

ーーーーーーーーーーーーーーーーーーーーーー

⑧DB連携（登録のみ）

こちらはMySQLを使って、登録されたデータを管理していました。

DB作成までは私自身で行いませんでしたが、
PHPの中で

・insertでデータを挿入
・bindValueを通す
・最後にexecuteで実行

といった感じで、多少MySQLの記述をすることがありましたが、

今の私ではちょっと力不足なので、
「こういった方法で登録するのが安全」という説明までにとどめさせてください（笑）。

⑨PHP、Javascriptによるバリデーション機能

Javascriptでは、リアルタイムで予期しない入力内容があった場合、
フォーム近くにエラー文言を出します。

PHPでは、送信ボタンがクリックされたときにエラーがある場合、
表示ページに遷移せずに、入力ページに留めて、同じくエラー文言を出します。

それぞれのバリデーションには意味があり、

・Javascriptでバリデーションする
→登録ボタンを押さないとエラーが出ないのはユーザーにとって使いにくい
（えー、せっかく入力したのにって気持ちになる( ；∀；)）

・PHPでバリデーションする
→データをDBに登録する際には、必ずかける。
これにより、予期しないデータが入らないようにできる。

両方を両立する実装内容として今回は、

Javascriptでエラーを表示するJavascript専用のクラスを指定し、
動的に付与してエラー文言を出したり、削除したりしました。

PHPでも同様に、エラーを表示するPHP専用のクラスを作り、
表示・非表示を切り替えていました。

他にもやり方はいくつかありそうなので、
ここは私も勉強中です！

⑩テスト項目洗い出し（正常系、異常系）、テスト

実装した内容に対して、

・正常系：予期できる動き
・異常系：エラー文言など

といった感じで、区分けしてテスト項目を洗い出して、１つずつチェックしていきました。

研修を通して得た学び

この記事はサービスが完成してから書いているので、
機能だったり、デザインだったり、最初から記事の内容がバシッと定まっていたわけではありません。

フィードバックや実装をしていく中で、修正が何回も発生しました。

「研修期間（２ヶ月）で取り組んだ課題」でも書きましたが、

ーーーーーーーーーーーーーーーーーーーーーー

ワイヤーフレーム制作の時に、
いかにサービス内容が頭の中で整理できているか

ーーーーーーーーーーーーーーーーーーーーーー

という点が、
工数（どれだけの作業日数が必要か）だったり、
フィードバック、修正対応などに響いてくるということを
ものすごく実感しました (・∀・;)

「デザインを少し修正したい」となれば、
その後のコーディングや実装機能に影響があるし、

「機能を追加、変更したい」となれば、
テストを始めからやり直さないといけなくなったりと、

どのフェーズもその後の作業に響いてくることが、
自分で作っているにも関わらず大変でした。。。

これが他のメンバーに引き継ぐ内容だったら、
ほんと申し訳ない気持ちになります。

なので、もしこれからフロントエンドエンジニアになりたいって人は、
実務では一人では作業しないので、誰が見ても扱いやすいものを作ることが
自身の成長にもつながってくると思います。

ご参考までに。

また、ここまで詰め込んでしっかりと作り込むことは今まで経験がありませんでした。
とても実りの多い研修となりました。

毎回先輩方には、忙しい中、実業務の合間に丁寧に教えていただき、
その分頑張ろうと思いながら、なんとか形にすることができました。

yepの研修では、
その人のレベルに応じて柔軟に取り組んでくれる仕組みが整っているので、
自分が目指したいキャリアやビジョンを持っていれば、
確実に成長できる場所だな〜と改めて感じました！
 

今は研修が終わり、OJTに入って実際の案件に携わっています。
学んだことを活かせるように、これから頑張っていこうと思います。

それでは〜

The post yepのフロントエンドエンジニア研修！デザイン制作〜サービス公開まで first appeared on 株式会社yep.

その２ヵ月ほど前の８月に、社内ではyetのロゴコンペが行われていました。
その際、自分の作成したロゴを選んでいただいたので、そん時どんなことを考えていたか書きたいと思います！

まずはリサーチ！

ロゴ制作でも、開発をするにもまずは対象のリサーチは必須です。
自分はその時ベトナムに行った経験がなかったので、ネットで調べるのはもちろん、ベトナムに行ったことがある方からベトナムの雰囲気や人の様子、yetがどんな方を募集しているのか、またその親会社にあたるyepの雰囲気も知っておきたかったので、長く勤めている方からyepはどんな会社なのか、どんな方が多いかなど細かく伺いました。

必要な情報が集まれば次はひたすら手と頭を動かします！

デザインを決める

自分は、ロゴに限らず広告や、イラストを見たときに最初に人間が印象として認識するのは色だと思っているので、まず色を決めました！
ネットの画像検索等でひたすらベトナムの画像を拾ってきては、色を抽出してバランスが良く、かつ自分がリサーチして聞いた印象に近くなるような組み合わせを模索します。

その次がロゴ作成になるのですが、ここはとにかく数を出します。
先ほど決定した色味は一度置いといて、「yet」の３文字をすべて使ったパターン、大文字にするパターン、「ｙ」のみを使うだけなどとりあえず書きながら浮かんだものを出力していきます。

その時書きなぐっていたのがこんな感じです↓（字は汚いですが、メモなんで…）

今回は一人何個でも提出可能だったので、書き出したロゴから２つをイラストレーターで整え、資料をこしらえて提出しました。
提出したのはこんな感じで、左側には作成したロゴの使用例、右側は自分がこのロゴで感じてほしいことや、デザインに関する詳細を記入しました。

その二週間後ぐらいの全体会議で選ばれたロゴの発表があり、自分の作成したものが出たときはすごくうれしかったです。

実物とご対面！
そして先月の社員研修で無事yetの看板を生で見ることができました！
自分の作成したものが実際に会社のロゴとして使われていて、発表を聞いた時より実感が湧きましたし、誇らしかったです。

以上アオキからでした。

The post yetロゴ制作をするにあたり first appeared on 株式会社yep.

これまで、アパレル、商社、飲料メーカー、通訳・翻訳など様々な業界を経験し、人生最後のキャリアチェンジ！

ということで、デザイナー未経験枠でyepへ入社させていただきました。

この度未経験枠入社恒例の、３ヶ月研修を無事終えましたので、その研修の様子を皆様にお届けできたらと思います！

１ヶ月目

まずは、IT・デザインの基礎知識を身につけるところから始めよう！

ということで、研修１ヶ月目は、座学メインのカリキュラムです。

始めの２週間は、基本情報技術者の書籍をひたすら読み、知らない用語、単語と睨めっこの日々が続きました。

業界自体未経験なこともあり、耳にしたことはあるけど深い意味は理解していなかったITのこと、

これまで全く聞いたことや使ったことのない専門的な用語・単語などがたくさんあり、

インプット量の多い期間となりました。

正直頭がパンクしそうになりましたが、週２回先輩社員へ質問ができる場が設けられていたため、

疑問点を解消しながら進めることができました。これ、非常に助かりました。

基本情報技術者完読後３週目に入ると、次はデザインの基礎を学びます。

「ノンデザイナーでもわかるUX＋理論で作るWebデザイン」

「クリエイターのための権利の本」の２冊を読み進めます。

こちらはデザイナーとして心得ておくべき基本的な内容だったので、

独学で得た内容をベースに復習を兼ねて進めることができたと思います。

４週目に突入！

基礎が身についたら、次はProgateにて実践的なコーディングを学びます。

フロントエンドで使用する言語、HTML、CSS、JavaScript、JQueryを受講しました。

HTML、CSSは入社以前にすでに受講していたこともあり、

一部コースを割愛しながら進めることができたため、前倒しで完了することができました。

２ヶ月目〜３ヶ月目

さて、研修も２ヶ月目に突入。

無事IT全般、デザイン、コーディングの基礎知識も身につき、土台が完成しました。

ここからは実習のスタートです！

本来実習は擬似課題を行うはずが・・・

今回はなんと、先日ブログでも紹介のあった、

ベトナム現地法人、yetのコーポレートサイト制作を担当させていただくことが決まりました！

→リリース済みのサイトはこちら：https://ye-t.net/

研修の実習課題なのに、リアル制作案件で、正直ビビっていたのが本心です。

が、実際に世に出回るサイトになるということで、モチベーションも一気にアップです！

全過程において非常にワクワクしながら制作を進めることができました！

制作スケジュール

スケジュールはざっくりと下記のような流れで進めました。

1. 現地調査（ベトナム市場調査、競合調査など）：3日間　
2. WF制作：5日間
3. デザインカンプ：10日間
4. コーディング：15日間
5. WP化：6日間

せっかくなので、上記制作過程の成果物を一部掲載したいと思います。

WF制作

コンテンツ、大まかなレイアウト、文言についてをざっくり決めていきます。

メインはコンテンツ、コンテンツの並び順の確認・確定になります。

因みに、今回の制作はマルチリンガル対応ということで、ベトナム語、英語、日本語での制作になります。

よって、まずは英語での制作から進めました。

WFの段階からすでに入れられそうな文言は英語で入れていきます。

（Webサイト用の文章を考えるのは初めての経験。結構苦労しました。。。）

デザインカンプ

デザインのフェーズに入り、本来であればカラー選定が重要になってくる段階ですが、

ロゴが確定していないため、色味は仮置きで制作を進めました。

最終成果物は色味が変わり、雰囲気もガラッと変わったものになっています。

是非、本サイトをご覧ください。

yetコーポレートサイト：https://ye-t.net/

全体を通して

サイト制作の目的として、現地法人設立にあたりローカル人材を採用したいという点に焦点を置きました。

この目的を果たすべく、全体的に人物を用いた写真素材をたくさん使うようにしたり、

20〜30代の若手をターゲットと想定し、現地IT人材が就活時に求める要素などを調査した上で、

モダン、革新的なデザインを意識しながら制作をしました。

制作を進めていく中で、大変だった点は大きく2つ。

1つ目は、前述のとおり3言語のマルチリンガルサイトになること。

英語で制作を進め、デザインの段階で全て日本語に翻訳。

ここまでを単独で進め、ベトナム語への翻訳をアウトソーシング。

期限までにきちんと納品されるようスケジュール管理をおこないます。

自分自身の翻訳作業や外部の方の管理も含め、遅延のないよう進めていく点は少し大変でした。

2つ目は、yetのロゴが社内コンペで決まるということで、

テーマカラーなどもロゴとの兼ね合いで最終的には変更する可能性があったこと。

デザイナーは社内コンペへの参加必須で、ロゴ制作を並行して実施する必要があり、

ロゴ制作は未経験だったため、基礎から調べながらの制作になりました。

全体的にスケジュール管理など、大変だなと感じる部分もありつつ、

なんとかリリース予定日までに制作を完了することができました！

研修終了！

無事、コーディング、WP化も終え、研修の最後を飾る発表会の日がやってきました！

ついにこの２ヶ月間で制作してきたものをお披露目する場がやってきました。

当日はとっっても緊張しましたが、発表も無事終え、ポジティブなFBもたくさんいただくことができました。

そして、何より達成感です！改めて、発表の場があって良かったなあと感じました。

最後に

ここまでの３ヶ月間、なんだかんだあっという間に過ぎていきました。

現在はOJTに入り、研修中には経験することのなかったリアルな課題に直面したりしながら日々を送っております。

まだまだ未熟者ではありますが、研修での学びを糧に、

1日でも早く一人前のデザイナーとして活躍できるよう頑張りたいと思います！

The post 未経験デザイナーの研修記録 first appeared on 株式会社yep.

パラレル ZOOってどんなゲーム？

パラレル ZOOは埼玉県にあるレジャー施設『東武動物公園』とコラボして生まれたスマートフォン専用アプリです。

東武動物公園は遊園地、動物園、花と植物の広場が融合した埼玉県内有数のハイブリットレジャーランド！

パラレル ZOOは、そんな東武動物公園内を歩き回ってデジタルどうぶつを探したり、
図鑑に記録してコンプリートを目指したり、
アプリ内に自分だけの動物園を作ることができるゲームです。

パラレル ZOOのアプリを起動して園内にあるデバイスに近づくと、
デバイスからアプリが情報を受信してデジタルどうぶつが出現するようになっています。
これによって、実際にプレイヤーがいる位置の近くにいるデジタルどうぶつをアプリ上でも見つけることができ、図鑑に記録することが可能です。

出現したデジタルどうぶつを図鑑に記録すると、アプリ内の動物園にそのデジタルどうぶつを呼ぶことができ、
自分だけの動物園を作ることができます！

他にも呼んだデジタルどうぶつに食べ物をあげて仲良くなったり、お店や遊具を飾ったり、
自分だけの動物園を盛り上げながら、図鑑のコンプリートを目指しましょう！

図鑑に登録したデジタル動物は、図鑑にその生態が記録されるので、
お子さんと一緒に動物園で実際の動物たちを見ながら、アプリでその動物のことをもっと知ることができます。

アプリはお子さんもお楽しみいただけるようになっていますので、是非大人だけでなく親子でもお楽しみください！

最後に

パラレル ZOOは2023年の4月にリリース予定です！
今後もブログにてパラレル ZOOに関するお知らせしていく予定なので、是非続報をお待ちください！

yepで一緒に働いてみませんか？

yepでは、新しいメンバーを募集しております。
経験者の方はもちろん、未経験の方も一緒に学んでいきましょう！

■未経験・中途採用の方
https://www.ye-p.co.jp/recruit/
https://en-gage.net/ye-p 

■2024新卒の方
https://job.rikunabi.com/2024/company/r425972095/

詳しくは上記URLからどうぞ！ お問い合わせ、お待ちしております！

The post 【近日リリース】yep初のスマートフォン用ゲームアプリ『パラレル ZOO』 first appeared on 株式会社yep.

会社によって研修の定義は様々あるかと思います。
複数人で行う新入社員研修、長距離移動を伴う現場研修、資格取得やキャリアアップに伴って受ける研修…
恒例であれば前幹事からの引継ぎがあったり、過去資料を漁ったりして
おおよその概要が掴めると思いますが
 

社会で生きていると、

『突発的に発生したイベントで前例や比較対象がない』
『引継ぎなし、前幹事不在(または気兼ねなく相談できる人が見当たらない)』
『そもそもこの類のイベントに参加した経験がないため、イメージがつかない』
『分かっているのは、”全てを任された”ということだけ』
という状況に出くわすことは少なくありません。
社会、手厳しいですね。
 

今回は
『この類の幹事が未経験』『内容の自由度が高い』のに
なんか気づいたら研修幹事になった方に向け、
【宿泊研修幹事はこんな考えとくといいかもよ 10のこと】をご紹介します。
先日yepで行った宿泊研修の内容を元に書き出し
(なんなら引継ぎ資料代わりに）していますので、
暗中模索のお守り代わりにしていただけたら幸いです。

研修の目的

”何が達成したら成功”と言えるのかを具体的にして、共通認識を持ちましょう。

• 参加者全員が同じ条件で情報を共有し、共通認識を持つ、
• スキル習得に必要な知識を提供し、研修終了後の確認テストで〇〇点以上を取る、
• 参加者全員が会話を交わす機会を作り、仕事内容と名前が一致する程度に親睦を深める

など、
目的や目標を関係者間で明確にしておくと、この後の取捨選択がしやすいです。

ちなみに、今回の研修の目的は
『社員全員が同じ情報を同じ条件で共有し、社内に共通の認識を作る』でした。

日時

一から考える場合、これを決めるのが最大の難所と言っても過言ではありません。
yepの場合、
業務の都合や外部講師のスケジュール、大型連休、各ご家庭の運動会日程などなど加味した結果、
当初の予定から3ヵ月ほど後の開催になりました…

とは言え、目的をきちんと明確にしていれば心配はありません。
『目的が果たせる日程』で調整すればいいのです。
ただそれだけです。
色々な意見が出て来ますが、ここは目的を見失わず！根気よく調整しましょう！！
……頑張って！！！

そして、決まったら素早く参加者に日程の連絡！他の何が決まってなくても日程連絡！！
知らなかったとか、予定入れちゃったとか知りません。
先手のスケジュール調整は正義です。

ということで、この調整を乗り切れば60%は終わったも同然。
根性論気味になりましたが、ここだけはパパっと抑えてしまいましょう。

ちなみに、過ごしやすい気候の時期は、おおかた行楽シーズンでもあります。
ハイシーズン料金やイレギュラーな交通状況など、合わせて調べおくのがおすすめです。
また、日程が会社の営業日と重なる場合は、
関係各所に業務調整や連絡の協力もしてもらいましょう。

場所

正直、これは日程決めと切り離せないことが多いので、
日程決めの段階で、ある程度候補と目処を立てておくのが良いでしょう。
場所によっては、移動時間を考慮して日程を組まなくてはいけないので注意。

場所選びも”目的が果たせるか”で考えます。
たとえば、研修をするスペースや機材が確保できるか、
研究会場から宿泊施設までが近いか等は、案を絞る上で優先度を高くしました。

研修会場での滞在時間が限られている人がいる場合は、
前後の時間で移動が可能かも考えておく必要があります。

宿泊施設を利用する場合は、部屋割りの組みやすさで選ぶのもおすすめ。
友達同士で行く旅行と感覚の違いが出やすいので、部屋数に融通がきく宿泊施設は有難い。

参加者

目的によって研修への参加者は異なります。
”そもそも一定の人数が集まらないと研修が成り立たない”場合は、日程決めを先にしてください。
場所でも触れましたが、
滞在時間が限られている人が参加する場合は、その考慮も忘れずに。

基本的には出欠を取るだけの作業となりますが、
出欠を判断するのに必要は情報は先に流しておくと良いでしょう。

今回の研修だと『社員全員が同じ情報を同じ条件で共有』する必要があったので、
その情報だけを先に流して、出欠席の判断ではなく、日程調整に協力してもらいました。

外部講師

今回、研修の目的を達成するために外部講師をお呼びしました！

 ハラスメント対策専門家

 ダイヤモンドコンサルティングオフィス

 代表　山藤祐子さま

ということで、今回yepでは
ハラスメント研修(＋アンガーマネジメントとアサーショントレーニング)
を行いました！
内容の詳細については、後日ブログで書かせていただきますー
 

さて、研修までにどんなことしたかというと、以下のようは感じ
講師との調整

• 登壇日
• 研修内容の打ち合わせ
• yep用にカスタマズしてもらったテキスト内容の精査
• 会場までの移動方法
• 紙テキストの授受方法(直接会場に送ってもらう段取り等)
• 使用機材(PCは持参か？プロジェクターは使うか？接続端子は何か？等)

主催または参加者の準備

• 参加者が研修を受けるのに必要な持ち物
• 参加者名簿

特に、今回の研修場所までは移動方法が限られていたので、
研修の開始時間、終了時間を細かく調整しました。
テキスト内容の精査も、本当にこの内容が一番効果をだせるのか
かなり真剣に考えたなぁ…

移動手段

時期、場所、参加者、内容が決まってくると、移動手段の選定が始まります。
先にも触れましたが、
行楽シーズンは移動方法や時間がイレギュラーとなるため、頭の隅に入れておくこと。
逆をに考えれば、団体割引キャンペーンも発生するかも。
早めに確定すれば早割が適用されることもありそうですね。

条件を調べて、賢い方法を選んでください。

今回は新宿駅から苗場までバス移動、帰りは越後湯沢から新幹線で帰りました。
最初、バスという移動手段を考えていませんでしたが、
結果、交通費がだいぶお安くなったと思います。
バスで長距離移動する際は、人数と車の大きさも考えて手配すると良いかもしれません。

会場に直接行く人がいる場合は、
その過程でおこるアクシデントについても相談しておくと安心です。

食事

研修中の食事費が誰に負担になるのかは
研修の内容とタイミングによって異なってくるので、先に内部で確認しましょう。
会社側で用意する場合は
アレルギーがないか、代えは用意可能も要確認。

泊まりの場合、施設の宿泊費に何が何食含まれているか確認するのと同時に、
研修や他に日程に合わせて
食事を用意してもらう時間の調整を忘れずに。

研修の間に昼食を挟む場合は、
研修会場でお昼を用意してもらえるか、お弁当が手配できるかも確認が必要。
お昼ごはんは参加者のモチベーションを変えるようです。

宴会のご所望がある場合は、
可能な会場があるか、食事の時点で飲み放題をつけることが可能か
泊まりであれば、
持ち込みはしてもいいのか、途中買い出しはできるか
頭を抱えつつ把握しておくと良いでしょう。

持ち物

研修自体に必要な持ち物の連絡はもちろんですが、
泊まりの場合、アメニティ情報の共有をしておきましょう。
ドライヤーやパジャマなどの情報は、時期によって体調管理に直結します。
想定気温を共有してあげるのも親切かも。

また、社内から持ち出しが必要なもの、
持ち出すのに申請が必要なものがあれば、早期の準備を忘れずに行いましょう。
うっかり忘れないように注意。

参加しない人の対応

参加しない人と参加する人の出勤形態を区別する必要があるか、事前によく確認しましょう。
yepの場合は、常駐してくれている他社のメンバーさんがいらっしゃるので、
そのあたりを考慮しました。

社員は全員参加なので、

• その日オフィスを空けるのか
• 業務に必要な環境を整えるのに必要なもの・手続きがあるか
• 社員と連絡が取りたい時の連絡手段はどうするか

については事前に取り決めを行い、周知します。

また、このご時世なので
どうしても会場に参加できない社員が出た場合、
どのような対応が可能か、事前に計画しておきました。

予算

さて、最後となりましたが、一番大切な項目『予算』です。
予算があらかじめ提示されている場合なら、
上の項目が予算に収まるか、収まらないかで判断していくのがおすすめです。

しかし……
目的を達成するため、必要な事柄の見積取ってから
予算を算出して稟議に掛ける場合、
正直、上の項目の全ての概算か目処がついてないと見積が出せません！
あいやーー！！！

ということで、とにかく概算見積を出す場合、以下のことに注意！！

• 宿泊施設や移動手段の見積時、『あくまで見積段階』と伝える。
  予約確定は改めて連絡することを伝える。見積の有効期限やキープ期間を確認する
   
• 参加者に『見積を出したいから、状況把握をしたい』と伝える。
  決定事項の周知連絡なのか、ヒアリング段階なのか混乱させない。

私は色々怠っていたため、このあたりで痛い目みました…
皆さんが同じ鉄を踏まぬよう、晒しておきます…

会社や事情よって幹事に任せたい範囲はバラバラです。
決定権がある人と幹事で、相談や報告が必要なタイミングを
事前に認識を合わせておくことが不可欠！

最後に

とても長くなりましたが、上記の全てが必要あるかは
何度も言うように、会社や目的によって様々と思います。
考慮の必要がない項目は確認だけして、ちゃっちゃと片づけしまいましょう。

基本は調整作業となるため
”臨機応変”や”柔軟な対応”が得意な方や、決済権のある方には
あまり理解の得られない労力なのかもしれませんが、
ゴールのある作業なので、終わった後の解放感と
参加者の充実した様子を見る喜びはひとしおです。

それでは、全ての研修幹事に幸あれ！

The post 【保存版】宿泊研修までに何したらいいか分からない幹事向け！準備しておくべき10のこと first appeared on 株式会社yep.

アニメーション動画のメリットは、情報を視覚的に表現できるので、文字や静止画よりもストレートに伝えられる点です。短時間で視聴者に伝えたい情報を的確に伝えることができます。

アニメーション制作のおおまかな流れ

1.シナリオ作成
2.絵コンテ作成（デザイン、テイスト決め、素材制作）
3.動画編集

1.シナリオ制作

まずは伝えたいメッセージを決めて、全体のストーリーを作ります。ここでメッセージやストーリーを明確にしておかないと、あとからやり直す作業が出てくることもあります。時間をかけてしっかり決めます。メッセージとストーリーはできるだけシンプルにすると見やすく、伝わりやすくなります。

2.絵コンテ作成（デザイン、テイスト決め、素材制作）

シナリオが作成できたら、デザインやテイストを決めます。デザイン、テイストは動画の印象を決める大事な部分です。伝えたい、紹介したい内容に合った世界観に作り上げていきます。
デザインの方向性が確定したら絵コンテに入ります。メッセージや使用素材、動きなどを絵コンテにまとめておくと、編集作業が円滑に進められます。
絵コンテに合わせて必要な素材を用意します。素材は撮影したり、素材集などから購入することも可能です。
​​

3.動画編集

動画編集は、シナリオや絵コンテを元に編集ソフトで素材を組み合わせて編集できます。弊社では「Adobe After Effects」を使用して編集しています。動画編集の流れは、メインとなる映像を作成してから効果を付与していきます。ナレーションが入る場合は、タイミングを合わせてテロップを表示します。
映像が完成したら効果音をいれていきます。映像に合わせて適切なタイミングで音を入れていくと、画面だけで伝わりにくい部分を補え、品質の高い映像に仕上がります。

まとめ

アニメーション動画は、情報を可視化し、伝えたいメッセージを強く印象に残すことが可能です。アニメーション動画に興味がある方は弊社にご相談ください！
 

アニメーション制作ページ
https://www.ye-p.co.jp/animation

The post アニメーション動画制作のご紹介 first appeared on 株式会社yep.

さて、10月8日(金)〜10月9日(土)の期間に、社員研修で千葉県にあるリソルの森に行ってきました！
コロナの影響もあって、こういった行事はかなり久しぶりです。

社員研修では参加者全員がプレゼンをすることになっており、プロジェクターを使用して各自の持ち時間は3分〜15分の自由プレゼンを行います。
なんと今回のプレゼンでは最優秀賞のギフト券1万円分、特別賞（WATANABE賞）の2つが用意されており、プレゼンの準備にかなり気合を入れた人もいたみたいです。

前置きが長くなりましたので、そろそろ研修旅行についてお話したいと思います。

社員研修

【1日目】東京駅集合 10:45

実は前日に大きな地震があり各線の運行が大幅に遅延していました。
全員時間内に来れるか分からない状況のだったのですが、なんと時間よりも早くみんな集合していました。
流石です！ですが…わかしお7号に乗って出る予定だったのですが、そのわかしお7号が出ないとのことで、各駅停車の電車に乗ることになりました。

リソルの森到着（昼食） 13:00

無事リソルの森に到着。30分〜1時間遅れで昼食のお弁当を取ることに。
電車班とは別に車班もいたのですが、大渋滞に巻き込まれ更に1時間遅れで到着していました。お疲れ様です。

プレゼン開始 14:00〜18:00

プレゼンの様子の写真です。参加人数は15名で行われました。
みなさんしっかり作り込まれていて発表の姿勢も素晴らしかったです。
開始時間が遅れたのもあり16:30終了のはずが、18:00まで延長しました。
慣れていない事もあり中々疲れました…！

プレゼン結果発表 & BBQ 19:00

夕食の前にプレゼンの結果発表です！
優秀賞はMさん！セキュリティ関連の内容で安定感抜群のプレゼンでした。
特別賞（WATANABE賞）はKさん！機材トラブルでPCを使わずにアドリブでプレゼンをされていたのが特別賞のポイントに。
お二人共流石でした。おめでとうございます！

夜ご飯はテラス席で豪華BBQ！
お肉、海鮮など豊富で大変美味しかったです。大満足でした。

二次会、就寝 21:00

夜ご飯の後は各自温泉へ、そのあと二次会をする人は各々宿泊するコテージに集まりました。
コテージがかなり広めで良かったのですが、写真を撮るのを忘れてしまいました。スイマセン。
二次会は人によっては朝方4時まで起きていたみたいです。元気だ…！

【2日目】朝食、現地解散

朝食をいただいた後は、リソルの森から駅まで移動し現地解散となりました。
今回研修旅行という形は初めてだったので、貴重な体験となりました。

The post 社員研修 first appeared on 株式会社yep.