Usr 681ab43c-99d7-4e40-92ba-956d9d8d66e7/sandbox: Difference between revisions

From VRChat Wiki
No edit summary
No edit summary
 
(10 intermediate revisions by the same user not shown)
Line 1: Line 1:
== Action Menu ==
<!-- Template:UserProfile -->
The Action Menu is the primary way to access controls for your avatar and various other quick-access functions. When using an Avatars 3.0 avatar, these controls can be fully customized and can be one of many types. This menu allows you to drive various parameters, informing your avatar on how to react based on how you've set up your animators.
<div style="---radius: 0.5rem; ---card-flex: 1 0 max(calc(25% - 4rem), 230px); ---card-bg: rgb(60, 65, 72); ---card-padding: 1rem; ---card-title-color: rgb(85, 130, 138); ---card-title-margin: 0.5rem;">
 
  <h3 style="z-index: 5; margin-top: 2rem; padding-top: 0.2rem; padding-bottom: 0.5rem; font-weight: 700; color: rgb(106, 227, 249);font-size: 2.5rem; position:sticky; top: 0; background-color: var(--more-dark-grey); border: none;">{{{username|Username}}}</h3>
=== Using the Action Menu ===
  <div style="display: flex; flex-wrap: wrap; align-items: stretch; gap: 1rem; color: rgba(255,255,255,0.8)">
==== Controller ====
    <div style="flex: var(---card-flex); font-weight: bold; border-radius: var(---radius); background: var(---card-bg); padding: var(---card-padding); overflow: hidden;">
To open the Action Menu, hold down the "Menu" button that usually pulls up your Quick Menu. A new menu will pop up—this is the Action Menu. It provides quick access to items like emotes, emojis, avatar features, and more.
      <div style="position: relative; margin-inline: calc(-1 * var(---card-padding)); margin-top: calc(-1 * var(---card-padding)); margin-bottom: 3rem">
 
        <!-- PROFILE THUMBNAIL -->
Use your joystick to move the cursor. Select items by moving to them and releasing the joystick—similar to "flicking" to the item. You can change the settings to confirm selections with a trigger pull in the Action Menu settings.
        [[File:{{{thumbnail|Forester kangaroo (Macropus giganteus tasmaniensis) juvenile Esk Valley.jpg}}}|none|frameless|640x427px]]
 
        <div style="position: absolute; bottom: 0; left: 1.25rem; transform: translateY(50%); display: flex; align-items: center; justify-content: center; width: 80px; font-size: 2rem; aspect-ratio:1; font-weight: 400; background-color: rgb(55, 65, 82); border-radius: 100%; color: #fff; box-shadow: -2px 1px 0 0 #000, 0px 0px 0px 2px var(---card-bg);">{{{usernameInitials|XX}}}</div>
==== Desktop ====
      </div>
Press '''R''' to open the Action Menu. You can only open one menu in Desktop mode, and you must click to confirm your choices.
      <div style="display: flex; align-items: center; gap: 0.5rem;">
 
        <div style="width: 1.4rem; height: 1.4rem; border-radius: 50%; background-color: rgb(86, 242, 92); margin-inline: 0.1rem"></div>
==== Settings ====
        <div style="line-height: 1.15;">
Using the "Bindings" button in the Settings menu, you can change how you pull up the Action Menu. For instance, you can set it to open by clicking the joystick on your controller.
          <!-- STATUS -->
 
          <div style="color: var(---card-title-color); font-weight: bold; text-transform: uppercase; font-size: 0.8rem;">Status</div>
''Note: The Quest Hand Tracking Beta does not have access to the Action Menu yet. To control your avatar, use a Quick Menu wing instead.''
          <div style="font-size: 1.05rem">{{{status|Online}}}</div>
 
        </div>
=== Selection Methods ===
      </div>
==== Flick Select ====
      <div style="display: flex; align-items: center; gap: 0.5rem; margin-top: 1rem;">
In Flick mode, push the joystick in the direction of the pie slice you want to trigger. Pushing part way shows an indicator of the selection. Pushing all the way triggers the selection.
        <div style="margin-inline: -0.1rem;">[[File:Icons ShieldLevel Normal 25.png|none|frameless|28x28px]]</div>
 
        <div style="line-height: 1.15;">
==== Pick Select ====
          <!-- TRUST RANK -->
Pick mode involves pushing the joystick towards the pie slice and confirming the selection with the trigger on the controller (or mouse click on Desktop). The default mode is Flick, except for Vive controllers. You can switch to Pick mode in Action Menu > Settings > Flick enabled setting.
          <div style="color: var(---card-title-color); font-weight: bold; text-transform: uppercase; font-size: 0.8rem;">Trust Rank</div>
 
          <div style="font-size: 1.05rem">{{{trustRank|Trusted User}}}</div>
=== Layout ===
        </div>
The UI consists of three levels: the Action Menu, the Expression Menu, and the Puppet Menu.
      </div>
 
    </div>
==== Action Menu ====
    <div style="flex: var(---card-flex); font-weight: bold; flex: 1 0 max(calc(50% - 3.7rem), 230px); border-radius: var(---radius); background: var(---card-bg); padding: var(---card-padding);">
The root menu includes: Gesture Toggle, Config (for the UI), Emojis, Expression Menu, and Close.
      <div style="color: var(---card-title-color); text-transform: uppercase; margin-bottom: var(---card-title-margin)">Bio</div>
 
      <!-- BIO -->
==== Expression Menu ====
      <div style="font-size: 1rem;">
This menu can have various widgets, including stages. Entering a stage with puppets switches you to that stage's puppet mode. You can have multiple stages in each expression menu and a menu open in each hand.
{{{bio|Default bio goes here.}}}
 
      </div>
==== Widgets ====
    </div>
Widgets include Button, Toggle, and other control types, which can be configured to act in various ways.
    <div style="flex: var(---card-flex); font-weight: bold; border-radius: var(---radius); background: var(---card-bg); padding: var(---card-padding);">
 
      <!-- LOCATION -->
==== Puppet Menu ====
      <div style="color: var(---card-title-color); text-transform: uppercase; margin-bottom: var(---card-title-margin)">Location</div>
The Puppet Menu allows you to drive various values/parameters for your avatar. When building an Avatars 3.0 avatar, you can map these out. In this mode, you can move the joysticks, touch the Vive touchpad, or use your mouse to control the puppet.
      <div style="margin-inline: calc(-1 * var(---card-padding)); margin-bottom: var(---card-padding)">
 
        <div style="overflow: hidden;">
To return to the Expression Menu from a Puppet Menu, pull the trigger with the stick centered.
          <div style="margin-block: -1rem; display: flex; align-items: stretch; justify-content: stretch;">[[File:{{{locationImage|VrcHomeThumb.png}}}|none|frameless|800x600px]]</div>
 
        </div>
=== Closing and Saving ===
      </div>
To close the Action or Expression Menu or any of their folders, choose the Back option at the top of the radial menu. Clicking the joystick (holding down the Vive button or pressing '''R''' on the keyboard) will close the menu but remember your place. Reverse this process to return to where you left off.
      <div style="font-size: 1.1rem;">
 
{{{location|VRChat Home}}}
=== Puppet Menu Example ===
        <div style="display: flex; flex-direction: column; gap: 0.33rem;">
[[File:PuppetMenu.webp|thumb|The Puppet Menu in action]]
          <div style="display: flex; gap:0.2rem; align-items: center;">
As you move your joystick/touchpad/mouse in various directions, you drive animation parameters to different values. This setup allows blending between various "moods," such as "happy" and "surprised," or other adjacent moods.
            <div style="display: flex; align-items: center; justify-content: center; width: 1.2rem; height: 1.2rem; border-radius: 50%; background-color: rgb(0, 51, 154); margin-inline: 0.1rem">
 
              <div style="width: 59%; height: 59%; border: 1.9px dotted yellow; border-radius:100%;"></div>
This is one way to use the Puppet Menu. Anything that can be parameterized can be controlled from this menu. There are also toggle buttons and other types of UI elements still in development.
            </div>
 
            <div>#1337 - Invite</div>
You can pull up one menu on either hand (or both simultaneously). By default, you "flick" to select an option. In the Action Menu settings, you can choose to use the Trigger to select an option.
          </div>
 
          <div style="display: flex; gap:0.2rem; align-items: center;">
To back out after making a selection in the Expressions menu, pull the trigger. Pull the trigger again to return to the main menu.
            <div style="margin-inline: 0.1rem;">
 
              <div>[[File:Icons Social 25.png|none|frameless|18x18px]]</div>
=== Accessing the Action Menu ===
            </div>
==== Valve Index Controllers ====
            <div>1/16</div>
* Pull up the Action Menu by clicking the joystick on the corresponding hand.
          </div>
* Back out of menus (or select an option when "Flick Select" is disabled) with the trigger.
        </div>
 
      </div>
==== Oculus Touch Controllers ====
    </div>
* Pull up the Action Menu by clicking the joystick on the corresponding hand.
    <div style="flex: var(---card-flex); font-weight: bold; border-radius: var(---radius); background: var(---card-bg); padding: var(---card-padding);">
* Back out of menus (or select an option when "Flick Select" is disabled) with the trigger.
      <!-- LANGUAGES -->
 
      <div style="color: var(---card-title-color); font-weight: bold; text-transform: uppercase; margin-bottom: var(---card-title-margin)">Languages</div>
==== Vive Wand Controllers ====
      <div style="display: flex; flex-wrap: wrap; align-items-center; gap: 0.5rem;">
* Pull up the Action Menu by clicking and holding the Menu button at the top of the controller.
{{{languages|<div style="display: flex; align-items: center; justify-content: center; width: 70px; aspect-ratio:1; font-weight: bold; background-color: var(--more-dark-grey-border); border-radius: 100%;" title="English">ENG</div>}}}
 
      </div>
==== Other Controllers ====
    </div>
* If there's a joystick, clicking it in should bring up the Action Menu.
    <div style="flex: var(---card-flex); font-weight: bold; border-radius: var(---radius); background: var(---card-bg); padding: var(---card-padding);">
* Back out of menus (or select an option when "Flick Select" is disabled) with the trigger.
      <!-- LINKS -->
 
      <div style="color: var(---card-title-color); text-transform: uppercase; margin-bottom: var(---card-title-margin)">Links</div>
==== All Controllers ====
      <div style="display: flex; flex-wrap: wrap; align-items-center; gap: 0.5rem; font-size:0;">
* Pull up the UI by holding down the Quick Menu button.
{{{links|<div style="border-radius: 100%; overflow: hidden;"><a href="https://vrchat.com/home/user/usr_7d3dca04-5671-4738-a277-04fad9b586e4"><div style="display: flex; align-items: center; justify-content: center; width: 70px; aspect-ratio:1; font-weight: bold; background-color: var(--more-dark-grey-border); border-radius: 100%; font-size: 0.95rem;">VRChat</div></a></div>}}}
 
      </div>
==== Desktop Mode ====
    </div>
* Press '''R''' to pull up the Action Menu.
    <div style="flex: var(---card-flex); font-weight: bold; border-radius: var(---radius); background: var(---card-bg); padding: var(---card-padding);">
* Move the mouse to select items, and click to confirm selections.
      <!-- BADGES -->
* Click to back out of menus.
      <div style="color: var(---card-title-color); text-transform: uppercase; margin-bottom: var(---card-title-margin)">Badges</div>
 
      <div style="display: flex; flex-wrap: wrap; gap: 0.5rem;">
=== Debug Menu ===
{{{badges|<div title="Supported VRChat through VRC+ when it first launched">[[File:Early_Supporter.png|none|frameless|70x70px]]</div><div title="Awarded to users who have made major contributions to the localization of VRChat">[[File:VRChatTranslatorBadge.png|none|frameless|70x70px]]</div>}}}
The debug menu in the Action Menu is a powerful tool. It displays the current animator state of your avatar, including parameter values, tracking states, and current motion states. It is useful for debugging.
      </div>
    </div>
    <div style="display: flex; flex-direction: column; flex: var(---card-flex); font-weight: bold; border-radius: var(---radius); background: var(---card-bg); padding: var(---card-padding);">
      <div style="color: var(---card-title-color); text-transform: uppercase; margin-bottom: var(---card-title-margin)">Groups</div>
      <div style="flex-grow: 1; display: flex; align-items: center; justify-content: center; color: var(---card-title-color); text-align: center; font-size: 1.3rem; line-height: 1.25; font-weight: 700;">{{{groups|Not representing<br/>any group}}}</div>
    </div>
  </div>
</div>

Latest revision as of 06:35, 7 August 2024

Username

Forester kangaroo (Macropus giganteus tasmaniensis) juvenile Esk Valley.jpg
XX
Status
Online
Icons ShieldLevel Normal 25.png
Trust Rank
Trusted User
Bio

Default bio goes here.

Location
VrcHomeThumb.png

VRChat Home

#1337 - Invite
Icons Social 25.png
1/16
Languages
ENG
Badges
Early Supporter.png
VRChatTranslatorBadge.png
Groups
Not representing
any group
Retrieved from "https://wiki.vrchat.com/index.php?title=User:Usr_681ab43c-99d7-4e40-92ba-956d9d8d66e7/sandbox&oldid=2440"