{"slug":"game-status-ui","title":{"ja":"ゲームのステータス画面","en":"Game status UI"},"summary":{"ja":"斜めに切った非対称のパネルに、能力値のバーやアイコンを並べるゲームの画面。","en":"Asymmetric panels with slanted cuts, holding stat bars and icons, as in a game status screen."},"categories":["uiux","motion"],"subAspects":["uiux.style"],"aspects":["uiux"],"tags":["game-ui","hud","status-screen","panels"],"palette":[{"name":"Night","hex":"#060810","ratio":0.5},{"name":"Panel","hex":"#242A42","ratio":0.24},{"name":"Crimson","hex":"#C81E2C","ratio":0.12},{"name":"Off-white","hex":"#EEF1FC","ratio":0.08},{"name":"Cyan","hex":"#37E9FF","ratio":0.06}],"keywords":["game UI","status screen","stat bars","persona-like menu","slanted panels"],"traits":{"en":["Panels are parallelograms or have diagonally cut corners, overlapping at different angles","Stat bars run horizontally with thick fills proportional to the value, and a number at the end","Strong red, black and white with a cyan accent; bold condensed type","A row of small square icons and a large character portrait area","In motion, panels slide in at an angle and bars fill up"],"ja":["パネルは平行四辺形か角を斜めに落とした形で、違う角度で重なる","能力値のバーは横に走り、値に比例した太い塗りと末尾の数字がある","強い赤・黒・白にシアンのアクセント、太い縦長の書体","小さな四角いアイコンの列と、大きなキャラクターの絵の枠","動きでは、パネルが斜めに滑り込み、バーが満ちる"]},"prompt":"Game status UI: overlapping parallelogram panels with diagonally cut corners at different angles, horizontal stat bars with thick fills proportional to the value and numbers at the ends, a row of small square icons, strong crimson, black and off-white with a cyan accent and bold condensed type. As video, panels slide in at an angle and bars fill up.","negativePrompt":"rounded soft UI, pastel, realistic photo, minimal flat web app, serif type","contrasts":[],"images":[],"references":[{"label":"remotion-video-ui-library — UI/AsymmetricStatusPanel","url":"https://github.com/asamiile/remotion-video-ui-library/tree/main/src/UI/AsymmetricStatusPanel"},{"label":"remotion-video-ui-library — UI/BattleCalloutBanner","url":"https://github.com/asamiile/remotion-video-ui-library/tree/main/src/UI/BattleCalloutBanner"}],"links":{"page":{"ja":"https://visual-gallery.asami.tokyo/ja/styles/game-status-ui","en":"https://visual-gallery.asami.tokyo/en/styles/game-status-ui"},"json":"https://visual-gallery.asami.tokyo/api/v1/styles/game-status-ui","markdown":"https://visual-gallery.asami.tokyo/api/v1/styles/game-status-ui/md"}}