KMC活動ブログ

京大マイコンクラブの活動の様子を紹介します!!

「Happy Elements式 ゲーム開発の基礎語ります」を開催しました!

こんにちは!KMC 45thの進捗ゼミです。

2024年6月14日に、Happy Elementsさんをお招きし、「Happy Elements式 ゲーム開発の基礎語ります」という新歓イベントを開催しました!

ゲーム開発現場で活躍しているゲームデザイナーの方に、ゲームを面白くするためのコツや、時間の無い中でゲームを完成させるための工夫、 社内でのゲーム開発事例についてご講演をいただきました。

当日の様子

15人もの新入生が参加してくれました

少人数チームでのゲーム開発のコツについて学びました

手作り感がいい感じの会場の飾りつけ

Happy Elements社内で短期間でゲームを完成させるSuper Liteプロジェクトの事例についてお話いたしました。

解説していただいたゲーム事例。Super LiteのWebページから遊べます!

実際にゲームを遊びながら学びました

KMCとゲーム開発

KMCでは、毎年新入生がチームを作ってゲームを開発する「みんなでゲームを作る」という新歓プロジェクトを開催しています。 初心者がぶっつけ本番で挑むプロジェクトなので、すんなりいくチームもあれば、苦戦するチームもいます。

2023年NFに展示されたゲーム

スムーズなゲーム開発をサポートするため、ゲームの規模感と開発のスケジュールについて現場のリアルを学んでもらいたいという思いから、今回のイベントを企画しました。

今回のイベントに参加した新入生が刺激を受け、楽しみながら面白いゲーム開発をしてくれたらうれしいです!

ご参加ありがとうございました!

Happy Elementsの皆様、参加者の皆様、本当にありがとうございました!

新歓BBQを開催しました!

こんにちは!id:crashrt です。

6/1(土) に今年の新入生を呼んで新歓BBQを開催しました! 今年入部してくれた新入生が18人も参加してくれて賑わっていました

BBQの様子

新入生の一人が「一致するまで終われまテン」というミニゲームを遊べるサイトを教えてくれたのでみんなで遊びました。 珍回答続出で大盛り上がりでした。教えてくれた方ありがとうございます〜

時間に少し余裕があったので、自然の中を散歩してきた人たちもいたみたいです。

最後に

参加してくれた新入生の皆様、ありがとうございました! これからもよろしくお願いします!よきKMCライフを!

そして、新入生の参加費無料はOBの方々のカンパのおかげで成り立っています。 カンパしてくださったOBの皆様、本当にありがとうございました!

「Go言語ワークショップ with Money Forward」を開催しました!

こんにちは!KMC 46th の id:walnuts1018 です。

2024 年 4 月 25 日に、Money Forward の皆さんをお招きし、「Go 言語ワークショップ with Money Forward」という新歓イベントを開催しました!

初心者向けには、Go 言語の基本的な文法を学んで HTTP Client / Server を実装するという内容、上級者向けには、「ゲームエンジン Ebitengine を使ってアートを描いてみよう」という内容で、それぞれハンズオンを行っていただきました。

詳細な内容やコードについては、以下のリポジトリにて公開していますので、ぜひ体験してみてください! github.com

当日の様子

KMC のお仕事

ワークショップの内容についてはすべて Money Forward さんにお願いしましたが、KMC ではオンライン開発環境の提供を行いました。

KMC 内のオンプレサーバーにて、VSCode のブラウザ版 (coder/code-server)をセルフホストし、参加者の方々に使っていただきました。

裏側では結構てんやわんやでした...

VM のメモリ割り当てをドタバタで増やしている様子

Pod のメトリクス

また、質問対応やサポートを他の部員にお願いしました。 スタッフとして参加していだたいた部員の皆さん、ありがとうございました!

ご参加ありがとうございました!

Money Forward の皆様、参加者の皆様、本当にありがとうございました!

部内の主要サーバでProxmoxクラスタを組んだ話

はじめに

こんにちは、KMC4回生のsegreです。最近は部内のサービスを破壊することにハマっています。今回は部内の主要サーバの破壊と創造を行ったので事の顛末を紹介します。

マシンの紹介

KMCには主に4台のデスクトップPC内でLinuxサーバを動かしています。4台をさくっと紹介します。 デスクトップPCはすべてサーバーラックに収められています。

rack

shourin

最下段の左にあるのがshourinというマシンです。2022年に導入されたミドルレンジPCです。主に実験用/初心者用という位置づけになっています。

nozomi

最下段の右にあるのがnozomiです。2021年に導入された、当時最高のCPUとグラボを盛り込んだPCです。メモリは100Gあります。主に機械学習やメモリを使うゲーム用のサーバーになっています。

tamanegi

shourinとtachyoの上にある中央が青く光った箱がtamanegiです。元はデスクトップPC用のケースに入っていましたが、ラッキングしたかったのでラックマウントに対応したケースに詰め替えました。2019年から稼働しているこの中で最も古いPCです。メールサーバーやLDAPサーバー等重要なサーバーが収められています。

sakashita

tamanegiの上にある1Uのラックサーバーがsakashitaです。こちらはOBの方に譲っていただいたものです。HDDベイが大量にあるため、ストレージサーバーとなっています。メモリも潤沢であるため複数のゲームサーバーが動いています。

Proxmoxクラスタを組んだ

今まで各マシンではKVMVMを管理していました。しかし、サーバー間のマイグレーションのやりにくさ、管理の難しさからGUIで管理できるようにしたいという声が上がり、この度Proxmoxクラスタを組むことになりました。

初期状態ではtamanegiとtachyonに多数のVMが存在し、shourinとsakashitaにはVMが存在しませんでした。

移行手順

2台でProxmoxクラスタを組む

まずはVMが何も入っていないshourinとsakashitaにProxmoxをインストールして2台でProxmoxクラスタを組みました。

VMをProxmoxクラスタに移す

続いて、tamanegiとtachyonのVMをshourinとsakashitaにマイグレーションしました。ここではライブマイグレーションすることができないので、VMを一時停止しdiskをコピーして移しました。移す際にVMの停止を忘れていたり、Proxmoxに移したことでNIC名が変わったりしたためややトラブルがありましたが、なんとか移し切りました。 ただ、tamanegi上で動いていたファイルサーバーだけはtamanegiに存在するディスクを用いていたためマイグレーションできませんでした。そのため、ファイルサーバーはtamanegiのOSを入れ替えた後に新たに構築することにしました。

OSをProxmoxに入れ替える

tamanegiとtachyonのVMはファイルサーバーを除きProxmoxに移ったので、OSをProxmoxに入れ替えます。

4台でProxmoxクラスタを組む

tamanegiとtachyonを既存のProxmoxクラスタに参加させます。これで4台でクラスタが組めました。

VMをLive Migrationする

先ほどshourinとsakashitaに移したVMをtamanegiとtachyonに戻したら作業完了です。proxmoxクラスタを組んだので1ボタンで簡単にLive Migrationできました。 結果として、以下の写真の通り4台でクラスタリングを行い、現在22個のVMが稼働しています。

pve

移行中のトラブル

ここでは移行中に起こったトラブルを紹介します。

VMのデータ不整合

まずは先程も述べたVMの停止忘れによるデータの不整合です。本来は停めてからdiskをコピーする必要がありましたが、停止を忘れていたため、Migration時にデータの不整合が生じ、サーバーが機能しなくなることがありました。

ディスク破損

冒頭にtamanegiのケースをラックマウント対応ケースに入れ替えたと申しまたが、このときにディスクのピンを曲げてしまいました......さらば4TB SSD

ちなみに、これとは別にSSDがかなり低速になる問題があり、そのSSDを交換したばかりの出来事だったため、RAIDを組み直すのにかなり苦労しました。

SSD

移行後

無事、稼働しているVMが一覧で簡単に見られるようになりました。 一方で、問題というほどでもないのですが、VM作成のコストが高いという声もありました。

KMCでは構成管理ツールにitamaeを用いています。itamaeはVMを作る際に簡単にSSHLDAPの登録ができるため非常に便利なのですが、VMを作るたびにマシンの定義をする必要があり、VMを頻繁に作成・削除するような場合には適しているとは言えません。

実現したこと

VMを簡単に作成できるようにするために、VMを作成したと同時にIPアドレスを自動で割り当てて固定し、VMのAレコードをDNSサーバーに登録して名前解決可能にする仕組みを作成しました。 これらはProxmoxでSDNの機能として提供されており、ほぼGUI上で作成することができました。Proxmox恐るべし......

IPアドレス固定

IP割り当てには、ProxmoxのIPAMを用いてIP管理を行いました。また、DHCPサーバーから受け取ったIPを用いてIPを自動で固定するようにcloud-initの設定を行いました。IPAM+cloud-initを用いることでVMを作成すると同時にDHCPサーバーから受け取った重複のないIPアドレスで固定されたマシンを作成することができます。 IPAMとcloud-init共にProxmoxのSDN機能として提供されていたため、簡単に構築することができました。詳しくは私が投稿した Proxmox VEでIPAM+cloud-initを用いてIP管理 をご覧ください。

DNS登録

Aレコードの登録にはPowerDNSで権威サーバーを立て、PowerDNSのREST APIをProxmoxから呼び出すことで実現しました。API呼び出しはProxmoxのSDN機能を利用しました。DNSサーバー自体は自分で構築する必要がありますが、この仕組みもSDNを用いれば簡単に実現できました。こちらも詳しくは私が投稿した Proxmox VEでVM作成時にDNSに自動登録 をご覧ください。

おわりに

今回は部内マシンのOSをすべて入れ替えて、Proxmoxクラスタを組みました!かなり大規模な改修であり、かつ主要なサーバーのダウンタイムをできる限り短くするため長時間ぶっ通しで作業したのでかなり大変でした。ProxmoxのSDN機能もまだまだ知らない機能があるのでもっとうまく活用していきたいです。ご覧いただきありがとうございました!

ICTトラブルシューティングコンテスト2023 に参加してきました

こんにちは!id:crashrt です。

KMCからインフラに興味のある4名がICTトラブルシューティングコンテスト2023(ICTSC2023)に参加しました! 結果は予選は231pt で8位、本戦は 1930pt で5位でした!

icttoracon.net

自分のブログで参加した感想を書いてみたのでよかったらこちらもご覧ください。

crashrt.hatenablog.com

令和最新版:KMC部員が教える正しいノートPCの選び方

こんにちは!
2024年度が始まりましたね!
新入生の皆さんの中には
「どんなノートPCを選んだらよいかわからない...」
という方もいると思います。
そこでKMC部員たちの知見を集めて
正しいノートPCの選び方をまとめてみました!
まだ迷っている方はぜひ参考にしてみてくださいね!

1. どういう要素を考慮すべきか?

まず、重要な要素を大きく3つ見ていきます! それは
1.持ち運びやすさ
2.スペック
3.あると嬉しい機能や注意点
です。

1.1. 持ち運びやすさ

ノートPCは大学などの外出先にもっていくことが多いため、
なるべく軽い方が良いです。
1.5kg未満のものが良く、1kgを切ると理想的です。
また、画面サイズは13~14インチあたりのものがちょうどよさそうです。
ただ、部員の一部からは、画面を左右分割したときの使用感の良さから
画面大きめの16インチほどのものを薦める声も上がりました。

1.2. スペック

CPU

Intel社製のCPUの代表「core」シリーズと
AMD社製のCPUの代表「Ryzen」シリーズがあります。
ここでは、世代とモデルに着目します。
まずモデルについてです。
i や ryzenの後に付く数字は3や5,7があり、
数字が大きいほど高性能かつ高価になっていきます。
SNSやレポート作成、動画視聴などの
一般的な用途であればcore i3やRyzen3などで十分です。
KMCに入って様々なソフトを使用する場合、重くなる可能性があるため
core i7やRyzen7を搭載していると便利です!
また、世代も大切なポイントになってきます!
基本的には新しい世代が高性能ですのでそれを選んだ方が無難です。
Intelは12世代以降の性能が非常に高く、
10,11世代とは雲泥の差なので注意が必要です!

メモリ

ブラウザやレポート作成、SNSだけを用途にするだけなら8GBで十分ですが、
その他の少し重そうなソフトなどを使用する場合は
16GBを選んでおくと安心です。

ストレージ

写真や動画の保存など、色々と容量が必要になってくるため、
512GBはあったほうがよさそうです。

1.3.あると嬉しい機能や注意点

ここからは、あるとうれしい機能や注意点などを一つずつ見ていきます!
特定の学科特有の注意点もあるので注意です!

TypeCで充電できるとコンパクトな充電器に移行できる

PCの充電器は主に2種類あり、ACアダプターとType-Cケーブルがあります。
ACアダプターは比較的大きく、またPCの充電以外にあまり用途がないです。
他方で、Type-Cケーブルは小型で
スマートフォン等の充電も兼ねることが多いため、持ち運びに便利
です。

指紋認証が電源ボタンについているとストレスが少ない

起動に時間がかからないものはストレスが少なくて良いですよね。
Lenovo社のPCには、電源入れる瞬間同時に指紋認証してくれるものがあり、
ロックかかってる感が0なので参考にしてみて下さい!

バッテリーの公称値はあまり信用にならない

製品性能にバッテリー稼働時間の表記があるものが多いですが、
ノートPCのバッテリーは結構すぐにヘタってしまいます。
半分ぐらいに見積もっておくとそれなりに役に立つかもしれません!

保証について

ノートPCを購入する際には保証がついてくる場合が多く、
オプションでより長い保証を購入することもできます。
しかし、4年保証はそこまでいらないかもしれません。
3年ほど使って壊れたら買い替える目途になりそうです。
大学院に進学する可能性が高い理系は特に3年+3年という計画が立つので、
追加の保証を購入するかどうか迷っている方は参考にしてみてください!

ゲームもやりたい人は諦めてゲーム用のpcを別で買う

ノートPCは大学などへ持ち運びをするため、
スペックの高さよりも持ち運びやすさが重視されます。
基本的にゲーミングノートは大きく重いため、
持ち運びにくいのでお勧めしません。
PCゲームをやりたい場合は
デスクトップPCを別で購入することを検討してみてください。

情報学科や電気電子工学科ではWindowsPCが推奨される

情報学科の計算機科学コースは、2回後期、3回前期必修の実験の授業において
必要なソフトがWindowsLinuxというOSでしか使えないため、
それがないと学科からPCを借りるはめになり、面倒です。
電気電子工学科でも似たような事例があるため、
これらの学科に所属する方はWindowsPCが推奨されます。

用途別におすすめノートPCをご紹介!

気になったものはハイパーリンクから飛べるのでぜひ見てみてください!

PCソフトを使う演習が入っている学科の方、 またはKMCに興味がある方向け

HP Pavilion Aero 13-be 13-be2000 パフォーマンスモデルG3

h20547.www2.hp.com

カスタムや性能:Ryzen 7 7735U, 16GB, 512GB, 13.3インチ, 約0.95kg
・こちらはコスパと性能を両立したモデルです!
十分な性能と軽さを持ちながら、12万円で購入できます。

Dell Inspiron 13 i7-1360Pモデル

www.dell.com

カスタムや性能:core i7-1360P, 16GB, 512GB, 13.3インチ, 約1.24kg
こちらは解像度が2560×1600とちょっと高かったり、TypeC給電が出来たり、
Thunderbolt4というポートがついていたり、便利な要素がついてくるノートPCです!
Thunderbolt4を簡単に説明すると、
USB Type-Cと互換性がありますがデータの高速転送に優れています。
約1.24kgと先ほどのものより少し重いですが、
今上げた要素のいくつかに魅力を感じた方にはおすすめです!

富士通: LIFEBOOK WU-X/H1

fmv.fccl.fujitsu.com

カスタムや性能:i7-1355U, 16GB, 512GB, 14インチ, 約0.69kg
こちらの最大の特徴はなんといってもその軽さです。
軽くてびっくりします。
これに慣れてたら他人のPCを借りたときに
手が滑って落とすんじゃないだろうかというくらいです。
国内メーカーなので約20万円と少し値段は高いですが、
突き抜けた性能という点でおすすめです。
また、端子が豊富なのもおすすめポイントです。

文系など、そこまでPCを酷使しない学科の方やPCになじみがない方向け

ASUS Vivobook 14X X1403ZA

www.asus.com

カスタムや性能:i3-1220P、8GB、512GB、1.6kg
PCの使用用途がレポート作成やSNSなどであれば、
約9万円と安価なこちらでも十分な性能です。
ただ、少し重いため、
少々値が張っても上記のような軽いものを買っておくとよいかもしれません!

3.おわり

いかがでしたでしょうか?ノートPCの購入で迷っている方の参考になれば幸いです!

外部web改造(デザイン編)

こんにちはこんにちは、id:crashrt です。

最近、KMCのサイトが新しくなりました。 デザインから実装まで色々改造しています。 今回は僕が担当したデザイン部分について書いていきたいと思います。 改造後の様子は以下のサイトから確認してみてください。

www.kmc.gr.jp

Image from Gyazo

外部web改造の発端

外部webの改造が始まったのは2年近く前の2022年1月です。 GlassmorphismとかNeumorphismとかについて話してるうちに 「KMCのサイトにNeumorphismとか取り入れたら面白そうじゃね?」 となり、改造が始まりました。

ちょうど実装側も改造したいねという話があったようで、 色々変えていくことになりました。

ページ構造の変更

よりサイトが見やすくなるよう、ページの構造を少し変えました。 大きく変えたのはトップページと活動内容のページです。

トップページ

まずはサイトでアクセスしたときに最初に表示されるトップページを変えました。 外部webの目的は活動内容の公開と入部案内と考えて、

  • 入部案内へのボタンをトップの上の方に設置
  • コンピュータ全般、だけでは活動内容が分かりにくいのでもう少し具体的な例を表示

することにしました。

活動内容

活動内容ページも少し変えています。 活動内容はKMCとしての「主な活動」と部員有志による「プロジェクト」に分けています。 もともとNFやコミケの出展情報のページは活動内容のページと並列だったのですが、出展もKMCとしての活動の一部なので 主な活動としました。

図にするとこんな感じです。

変更前

├ 出展情報
└ 活動内容
  ├ 部誌
  ├ アドベントカレンダー
  ├ エイプリルフール企画
  └ プロジェクト
    └ プロジェクト色々...

変更後

└ 活動内容
  ├ 主な活動
  │ ├ 作品集
  │ ├ 部誌
  │ ├ 出展情報
  │ ├ アドベントカレンダー
  │ └ エイプリルフール企画
  └ プロジェクト
    └ プロジェクト色々...

新しく作品集というものがありますがこれは今作ろうという話になっているサイトです。 そのうち実装・公開されると思います。

デザインの変更

デザインでは過度な装飾は避け、シンプルなデザインにすることを特に意識しました。 すっきりした印象にしたかったので、枠線などはあまり使わず余白を活用しました。 仕事でやっているわけでもないので僕が好きな感じのデザインにしています。

デザインソフトはAdobeのXDを使っています。 XDを使うのは初めてだったので色々調べながらだったのですがなんとかなって良かったです。 URLでデザインの共有ができるのは便利ですね。

配色

色は青を基本とした配色にしています。 使用している色は以下のとおりです。

  • 背景:#F2F2F2
  • ベース:#2D3D61
  • メイン:#4072B3
  • アクセント:#B82E6A

Image from Gyazo 配色は https://color.adobe.com/ja/create/color-contrast-analyzer を使ってコントラストが十分か・カラーの競合が無いか確認しています

Neumorphism

当初の目的のNeumorphismも要所要所で取り入れていきました。

Neumorphism(ニューモーフィズム) はデザインのスタイルの一つで、立体感のあるSkeumophism(スキューモーフィズム)をシンプルにしたものです。 背景と同じ色の要素にハイライトと影をつけて立体感のある要素に斜め上などから光が当たっているように表現しているのが特徴です。 詳しくは以下のサイトなどが参考になると思います。

coliss.com

普通のNeumorphismは光と影だけで要素を表現するため、すこし見づらいという欠点があります。 そこで、見やすくするために色々試してはいたのですが、 他の見出しなどに比べて主張が強くなりすぎたりくどくなったりしたので普通のまま使うことにしました。 が、見づらいのは変わらないので、ハイライトテーマの実装など今後なにか工夫をしていけたらいいなと思います。

色々試していたものたち Image from Gyazo Image from Gyazo

本当は Glassmorphism なども取り入れようとしていたのですが、背景選びが難しかったことや文字が読みづらくなりがちだったことから諦めました。 いいアイデアが思いつけばどこかで使えたら良いなと思っています。

まとめ

外部web改造後のデザインについて書いてみました。 webデザイン初心者が調べながら作ったものでまだまだ改善点はあるので、今後も色々改良していきたいですね。 毎年KMCのサイトを見て来てくれる新入生も結構いるので、より分かりやすいサイトになっているといいなと思います。