タグ

UIに関するs_ryuukiのブックマーク (2,149)

  • アニメーションをスムーズに見せるためのテクニック「指数平滑法」とはどんなものなのか?

    グラフィック系の開発者であるニキータ・リシッツァ氏が、「自身のプロダクトのあらゆる場所で使用している」と述べるお気に入りのテクニックである「指数平滑法」について解説を投稿しました。 My favourite animation trick: exponential smoothing | lisyarus blog https://lisyarus.github.io/blog/programming/2023/02/21/exponential-smoothing.html リシッツァ氏は下図のようなトグルボタンを例に解説を行っています。クリックすると「オン」「オフ」が切り替わります。まだアニメーションを何も設置しておらず、トグルボタンは左端と右端を瞬間移動しています。 機能的にはアニメーションが設定されていなくとも問題はないのですが、アニメーションを設定することでユーザーは何が起こって

    アニメーションをスムーズに見せるためのテクニック「指数平滑法」とはどんなものなのか?
  • 【Unity】Input Systemの仮想カーソルをローカルマルチで扱う方法

    ローカルマルチで複数プレイヤーが仮想カーソルで選択する画面を作りたい場合どうすればいいの? Input System提供のVirtual MouseとPlayer Inputを組み合わせて実現できるわ。 Input Systemでは仮想カーソル用のコンポーネントVirtual Mouseが提供されていますが、ローカルマルチなど複数プレイヤーがそれぞれカーソルを操作する場面では少し工夫が必要です。 やや面倒ですが、プレイヤー毎にVirtual MouseとPlayer Inputをシーンに配置して、操作対象を紐づける設定をスクリプト側から行えば実現可能です。 また、動画の例の様にカーソルをUIとして画面に配置する場合、いくつか運用の制約があり注意が必要です。 記事では、この注意点含めローカルマルチでプレイヤー毎の仮想カーソルを動かす方法について解説します。 動作環境 Unity 2023.

    【Unity】Input Systemの仮想カーソルをローカルマルチで扱う方法
  • 【Unity】Input Systemでプレイヤーに複数デバイスを割り当てる

    シングルプレイ、またはローカルマルチで一人のプレイヤーに複数コントローラーを割り当てるにはどうすればいいの? 複数デバイスを割り当てたControl Schemeを用意して適用すれば良いわ。 Input SystemのPlayer Input使用下において、1プレイヤーに複数デバイスを割り当てる方法の解説記事です。 次のような使い方を想定します。 想定する場面 キーボード&マウスでプレイヤーを操作する ゲームパッドとマウスを割り当てる(モンゴリアンスタイル) タッチパネルと物理キーボードを使用する 複数プレイヤーに複数コントローラーを割り当てる このようなデバイスの組み合わせは、Input Action AssetのControl Schemeの設定から自由に変えられます。 参考:Input Action Assets | Input System | 1.7.0 記事では、各プレイヤー

    【Unity】Input Systemでプレイヤーに複数デバイスを割り当てる
  • 【Unity】UI操作をInput Systemのローカルマルチに対応させる

    複数プレイヤーの選択画面で、複数コントローラーで同時にUIを操作するにはどうすればいいの? PlayerInputとMultiplayerEventSystemを使えば可能だわ。順を追って解説していくね。 複数コントローラーを接続したローカルマルチの環境で、UIを個別のコントローラーで操作する方法の解説記事です。 次のように、プレイヤー毎に割り当てられたゲームパッドなどでUIを選択したり決定したりする操作をさせることを想定します。 操作対象のUIは、例えば1P用、2P用で排他的に操作したり、共存させたりする事が可能です。 記事では、このような複数プレイヤーによるUI操作をInput Systemで実現する方法を解説していきます。 動作環境 Unity 2023.2.16f1 Input System 1.7.0 目次 非表示 前提条件 UI操作の実現方法の概要 設定手順 Event Sy

    【Unity】UI操作をInput Systemのローカルマルチに対応させる
  • [Claudia][Unity]自然言語によって動く2Dプラットフォーム

    はじめに CysharpからAnthropic Claude APIの.NET用、非公式クライアントライブラリClaudiaが登場しました。このライブラリの登場により、Unity上で簡単にClaude3のAPIを呼び出すことができます。また、Function Callingと呼ばれるLLMの出力から関数を呼び出す機能も簡単に実装できます。今回はClaudiaのチュートリアルとして、自然言語の入力からプレイヤーを操作できる2Dプラットフォームを実施します。 要所のコードを解説したのちに、最後は簡単に試せるサンプルコードを添付しています。 使用するライブラリ 今回使用するライブラリとして、Cysharpから登場したAnthropic Claude APIの.NET用、非公式クライアントライブラリClaudiaを使用します。Claudiaの導入方法に関しては、今回は触れませんがClaudiaリポ

    [Claudia][Unity]自然言語によって動く2Dプラットフォーム
  • 【Unity】Input Systemでキーリピートを実現するInteraction

    Input Systemでボタンを押しっぱなしにした時、「タン、タタタタタン」と反応させるようにしたいの。 キーリピートだね。やり方は色々あるけどInteractionを作って実装する方法を解説していくね。 Input Systemでキーリピートを実現する方法の解説記事です。 記事で解説するキーリピートは、ボタンを押しっぱなしにすると、押してからワンクッション置いて連打されるような挙動を想定しています。 実装方法は一通りではありませんが、Input Systemの機能であるInteractionを自作して実現すると、次のようなメリットがあります。 主なメリット 様々なボタン操作(Action)などに対してキーリピート設定を適用可能になる ゲームロジックと入力ロジックを綺麗に分離できる スティック入力などボタン以外にも適用可能 Input SystemのInteractionは、長押しやダ

    【Unity】Input Systemでキーリピートを実現するInteraction
  • Blazor C# チュートリアル - Claude APIで画像入力 - Qiita

    はじめに 前回「C#(Blazor)でClaude APIを使う方法について」の続きです。 記事では画像入力の機能について説明したいと思います。 完成イメージ このような感じで画像入力ができるように機能を追加したいと思います。 概要説明 ファイルの選択ボタンを押して画像を選択し、その画像を入力に使います。 ・BlazorApp1のHome.razor、Home.razor.csに変更を加えます。 以下のリンクUpload Fileを参考にコードを追加します。 Anthropic ConsoleにWorkbenchという機能があります。 API実行および実行時のコードやデータ構造を確認することができます。 コードはPythonTypeScriptですが、参考になると思います。 チュートリアル それでは機能追加していきましょう。 ファイルを追加するボタンを追加します。 ボタンを押すとファイ

    Blazor C# チュートリアル - Claude APIで画像入力 - Qiita
  • Blazor C# チュートリアル - Claude APIを使ってみる - Qiita

    はじめに タイトルの通り、C#(Blazor)でClaude APIを使う方法について説明します。 初回登録時に一定額の無料クレジットが付与されますので、無料で試すことができます。 Claudeとは Anthropic社が開発したAIモデル ChatGPTのように人間と自然な会話をすることができ、質問に答えたり助言したりすることが可能です。 ※会員登録が必要です。 詳しい解説はしませんが、まだClaudeを使ったことがない方には以下の記事がわかりやすいかもしれません。 Claudia 非公式ながらも強力な機能を備えたClaude API clientです。 Readmeが丁寧で初心者にもやさしい! Function Calling、Amazon Bedrockにも対応しています。 Unofficial Anthropic Claude API client for .NET. We hav

    Blazor C# チュートリアル - Claude APIを使ってみる - Qiita
  • Meta Quest Building Blocks: コントローラーを活用したインタラクションの構築

    概要 UnityでMeta Quest向けアプリを開発する際、Oculus Integration v57以降で提供されているBuilding Blocksを利用することで、 パススルー、シーンモデル、インタラクション、空間アンカーなどある程度シーンを自動生成することができるようになりました。 この記事では、インタラクションの構築に焦点を当て、なぜか自動生成されないコントローラーのインタラクションをどのように構築するかを説明します。

    Meta Quest Building Blocks: コントローラーを活用したインタラクションの構築
  • SwiftUIで作るタブ風UI - inSmartBank

    こんにちは!スマートバンクでアプリエンジニアをしているkanekoです。 先日リリースされたB/43の最新バージョンでは、お金の使いすぎを防ぐ家計管理サポート機能を拡充しました! prtimes.jp リニューアルにあたりUIKitで実装されていた画面をSwiftUIで新規作成したので実装の詳細とその際に調べたアニメーションの挙動について共有します。 支出画面について 支出画面はニュースアプリなどで見られる選択可能なタブ+スワイプでコンテンツを切り替え可能な画面で、以下のような要件があります。 選択可能な月が一覧で表示される(この月選択可能な画面をタブと呼ぶ) 表示されるタブは選択中の月を中央にして3つ それぞれの月はクリックで切り替えが可能 タブの下に現在選択中の月の支出情報が表示される 支出情報部分はSwipeで前後の月に切り替え可能。その際に上側のタブも連動する 支出画面 Swift

    SwiftUIで作るタブ風UI - inSmartBank
  • 【Unity】AppUI×ClaudiaでMVVMを意識してチャットアプリをつくる 4章 アプリ実装編 - Qiita

    はじめに この記事は3章の続きです。 まだ読んでいない人は3章から読まれることを推奨します。 この章では1章2章で説明したことを踏まえて実際にチャットアプリを実装していこうと思います。 記事を通じて疑問点があれば、ぜひフィードバックをください。 1章 設計説明編 2章 AppUI編 3章 MVVM実装編 4章 アプリ実装編 5章 Middleware編 アプリの実装 前章まででMVVMまで実装しました。 次はこれをアプリとして動かしていきたいと思います。 以下のようにファイルを作成してください。 Claudia ├── SampleResources │ ├── Styles + │ │ ├── ClaudiaPanel.asset + │ │ ├── ClaudiaTheme.tss │ │ └── MainPage.uss │ └── Views │ └── MainPage.uxml

    【Unity】AppUI×ClaudiaでMVVMを意識してチャットアプリをつくる 4章 アプリ実装編 - Qiita
  • 【Unity】AppUI×ClaudiaでMVVMを意識してチャットアプリをつくる 3章 MVVM実装編 - Qiita

    はじめに この記事は2章の続きです。 まだ読んでいない人は2章から読まれることを推奨します。 この章では1章2章で説明したことを踏まえて実際にチャットアプリを実装していこうと思います。 記事を通じて疑問点があれば、ぜひフィードバックをください。 1章 設計説明編 2章 AppUI編 3章 MVVM実装編 4章 アプリ実装編 5章 Middleware編 仕様を考える まずは仕様を考えていきましょう。 主要な機能は以下の通りです。 ユーザーがメッセージを入力する 送信するとClaudeの返信が来る 返信に対してさらにユーザーがメッセージを入力する 送信すると... (以下繰り返し) 今回はかなり単純なものでむしろ考える必要もないくらいですが、規模の大きいアプリの場合ここらへんを整理しておくことは重要だと思います。 なぜならば仕様が整理できていないと設計もできないからですね。 次は実際に設計に

    【Unity】AppUI×ClaudiaでMVVMを意識してチャットアプリをつくる 3章 MVVM実装編 - Qiita
  • 【Unity】AppUI×ClaudiaでMVVMを意識してチャットアプリをつくる 2章 AppUI編 - Qiita

    インストール後Samplesから各サンプルを入れることができます。 MVVM SamplesからMVVMを入れましょう。 また、MVVMに関する説明は1章でしていますので、まだ読んでいない方はそちらを読んでください。 フォルダ構造 MVVM ├── SampleResources │ ├── App UI Settings.asset │ ├── MVVMPanel.asset │ └── MVVMTheme.tss ├── Scenes │ └── MVVM.unity └── Scripts ├── ViewModels │ └── MainViewModel.cs ├── Views │ └── MainPage.cs ├── MyApp.cs ├── MyAppBuilder.cs └── Unity.Replica.AppUI.Samples.MVVM.asmdef サンプルシー

    【Unity】AppUI×ClaudiaでMVVMを意識してチャットアプリをつくる 2章 AppUI編 - Qiita
  • 【Unity】AppUI×ClaudiaでMVVMを意識してチャットアプリをつくる 1章 設計説明編 - Qiita

    はじめに 最近ではClaudeというチャットAIが来ているらしいです。 なんとこいつ、Chatgpt-4を超えるらしく相当優秀らしい。 ClaudeをC#で利用できるようにClaudiaというライブラリが開発されたとのことで、実際に利用してみようと思います。 単純に使ってみるだけだと面白くないので、最近リリース版になったAppUIを使ってMVVM設計でアプリとしてUnityで開発してみましょう。 現状AppUIの解説記事が全くないのでなるべく詳細に記事にすることとします。 1章 設計説明編 2章 AppUI編 3章 MVVM実装編 4章 アプリ実装編 5章 Middleware編 できるもの 以下のようなアプリを作成できます。 UIはClaudiaのBlazorのサンプルを参考にしています。 動画版もあるのでよかったら見てみてください。 リポジトリもあがっています。 対象読者 ある程度Un

    【Unity】AppUI×ClaudiaでMVVMを意識してチャットアプリをつくる 1章 設計説明編 - Qiita
  • .NET MAUIで普通のデスクトップアプリをビルドするには - Qiita

    概要 .NET MAUIで、普通のデスクトップアプリをビルドする方法の話です。普通というのは、msixインストーラで配布するパッケージではなく、exeとdllを作ってmsiインストーラなどで配布するタイプのアプリです。 先に結論まとめ プロジェクトファイルに<WindowsPackageType>None</WindowsPackageType>を追加 launchSettings.jsonのcommandNameをProjectに 発行はdotnet publishコマンドに「p:WindowsPackageType=None」を付ける 以上で、普通のデスクトップアプリとしてビルド・デバッグ・発行ができます ただしまだ問題点が多いようなので、実運用の開発への採用は要注意 話の背景 .NET MAUIWindowsアプリを作ろうとすると、msixインストーラで配布するという形の、どちらか

    .NET MAUIで普通のデスクトップアプリをビルドするには - Qiita
  • 『呪術廻戦 ファントムパレード』のUI開発事例 ~呪術廻戦を魅せるためのノンストレスUI~【CAGC2024】

    『呪術廻戦 ファントムパレード』はゲームプレイにおいてのストレスの無さにとても好評いただいており、売りとしているハイクオリティなクリエイティブによる世界観表現へのよりスムーズな没入を促しています。 セッションでは、ノンストレスを実現するために重要であった根にあるUI思想や、枝葉となるいくつかの開発事例にフォーカスして解説します。 https://cagc.cyberagent.co.jp/2024/session/index.html?id=S6uhsieB ©芥見下々/集英社・呪術廻戦製作委員会 ©Sumzap, Inc./TOHO CO., LTD. Copyright © CyberAgent, Inc.

    『呪術廻戦 ファントムパレード』のUI開発事例 ~呪術廻戦を魅せるためのノンストレスUI~【CAGC2024】
  • 『IDOLY PRIDE』の運用を支えるUnity開発フローにおける効率化テクニックの紹介【CAGC2024】

    セッションでは、弊社開発のスマートフォンゲーム『IDOLY PRIDE』のUnity開発フローにおける効率化テクニックについてご紹介します。 「IDOLY PRIDE」は今年でリリースから3周年を迎えようとしており、様々なイベントや機能を頻度高くリリースしてきました。Unity開発においては、社内の開発基盤やブランチの自動運用など様々な効率化テクニックにより運用が支えられています。 今回はそのテクニックについて具体的に解説します。 https://cagc.cyberagent.co.jp/2024/session/index.html?id=bU5Ar3jh Copyright © CyberAgent, Inc.

    『IDOLY PRIDE』の運用を支えるUnity開発フローにおける効率化テクニックの紹介【CAGC2024】
  • ゆめくろで効率的な開発をするためのデバッグ機能紹介【CAGC2024】

    セッションでは、ジークレストで運用中のタイトル『夢職人と忘れじの黒い妖精』の開発時および運用シーンで使われている各種デバッグ機能の紹介となります。 デバッグ機能は、QAや機能実装担当者のことを考慮した作りにしないと業務を効率化することができず、サービスの品質を担保するためにも軽視できないものです。 特にインゲームとなるバトルやメインコンテンツのシナリオ部分は手厚く実装しており、どういう画面になっているかも事例を用いてご紹介します。 再現性を高めるために細かなところまで実装を行っているので是非参考にしていただければと思います。 https://cagc.cyberagent.co.jp/2024/session/index.html?id=i4PJmwez ©bilibili ©GCREST

    ゆめくろで効率的な開発をするためのデバッグ機能紹介【CAGC2024】
  • もう迷わない!品質最大化のためのUIインタラクション開発フロー【CAGC2024】

    インタラクション制作のポイントを開発段階ごとに整理してお伝えします。 インタラクションは相互コミュニケーションが強いゲームでは特に重要ですが、開発の後工程になることも多く、プロジェクトごとで制作フローがまちまち。 ネットで検索してみても開発段階ごとのフローがまとまっている記事が少ないのが現状です。 サイバーエージェントゲーム事業部ではこの問題解決のため、インタラクションに知見のあるメンバーが集まりインタラクションを最大化するためのフローについて複数の記事を発信しています。 今回はその内容を具体的にゲームの事例を交えつつご紹介します。 https://cagc.cyberagent.co.jp/2024/session/index.html?id=M2dXUncF Copyright © CyberAgent, Inc.

    もう迷わない!品質最大化のためのUIインタラクション開発フロー【CAGC2024】
  • Unity PolySpatial 1.1.4を使ってC#とSwiftUIを連携させる

    概要 PolySpatial 1.1.4が発表されました。アップデートの中で注目なのが、SwiftUIの連携部分が追加された点です。 ただ、visionOSの仕組み上ちょっと癖のある実装となっています。今回は新しく追加されたSwiftUIと連携する方法について解説したいと思います。 SwiftUIはネイティブ実装 いきなり、Unityで開発するんちゃうんかい、という話ですがSwiftUIを利用するにはSwiftによる実装を行わないとなりません。しかし、visionOSの特徴である磨りガラス風のUIを利用できることを考えると一考の余地はあるでしょう。 UnityのオブジェクトとSwiftUIが共存している PolySpatialにおけるSwiftUIの仕組みを見てみると、やや力技と言わざるを得ない実装になっています。実装手順の概要を書くと以下のようなフローで実装していきます。 SwiftUI

    Unity PolySpatial 1.1.4を使ってC#とSwiftUIを連携させる