{"version":1,"pages":[{"id":"7j8FRjzhQM6yjTQab4Gv","title":"Installation","pathname":"/","siteSpaceId":"sitesp_mnklf","description":"There are 3 basics steps you need to follow to install FloatGrids in Unity. As for Figma, nothing to install, just get the file!","breadcrumbs":[{"label":"GETTING STARTED"}]},{"id":"nexV84TPjbD906sGIMKE","title":"Overview","pathname":"/getting-started/overview","siteSpaceId":"sitesp_mnklf","description":"FloatGrids is a UI framework for VR and AR that caters to the needs of both designers and developers and can be utilized on both Figma and Unity platforms.","breadcrumbs":[{"label":"GETTING STARTED"}]},{"id":"veKPikED3ZULmWJTP7TU","title":"Figma file","pathname":"/getting-started/figma-file","siteSpaceId":"sitesp_mnklf","description":"FloatGrids Figma file is a component based file. It uses variants and Interactive components, all the interactions between components are already done.","breadcrumbs":[{"label":"GETTING STARTED"}]},{"id":"wYkVsnytPUc6gzIz8UJ8","title":"Demo","pathname":"/getting-started/demo","siteSpaceId":"sitesp_mnklf","description":"We've developed a demo in both Figma and Unity so that you can check how FloatGrids performs with its own UI or with your own.","breadcrumbs":[{"label":"GETTING STARTED"}]},{"id":"rij6N90eIsQQ9YVtQY3G","title":"XR UI design guidelines","pathname":"/getting-started/xr-ui-design-guidelines","siteSpaceId":"sitesp_mnklf","description":"Let's get the basics to start designing stunning UI for XR apps by reading the following articles wrote by Albert Mauri, FloatGrids' creator and designer.","breadcrumbs":[{"label":"GETTING STARTED"}]},{"id":"slWq5K3vTvE3rfRmD1kJ","title":"Tutorials","pathname":"/getting-started/tutorials","siteSpaceId":"sitesp_mnklf","description":"","breadcrumbs":[{"label":"GETTING STARTED"}]},{"id":"Bgw01wiKUjR7m06gAaKJ","title":"Customization Overview","pathname":"/features/customization-overview","siteSpaceId":"sitesp_mnklf","description":"Customize Color, font styles, typographies and corners to all the UI components at once.","breadcrumbs":[{"label":"Features"}]},{"id":"FOoBGqkveiqchFqh2Y9d","title":"Color Palette","pathname":"/features/color-palette","siteSpaceId":"sitesp_mnklf","description":"Token based color palette in both Figma and Unity.","breadcrumbs":[{"label":"Features"}]},{"id":"y6RF5sNxfOroFUEQ7Cmj","title":"Typography","pathname":"/features/typography","siteSpaceId":"sitesp_mnklf","description":"FloatGrids include in the Unity package 9 different fonts for you to choose. However you can use your own, whatever you do, you can apply it to all the UI components with a couple of clicks.","breadcrumbs":[{"label":"Features"}]},{"id":"ua09NHrq0OYiCMrPFiWl","title":"Corners","pathname":"/features/corners","siteSpaceId":"sitesp_mnklf","description":"Apply corners to the primitive prefabs to get them applied to all your components.","breadcrumbs":[{"label":"Features"}]},{"id":"d0WEOrLnZJDXHUvuyLGM","title":"UI Components","pathname":"/features/ui-components","siteSpaceId":"sitesp_mnklf","description":"FloatGrids has, so far, 32 UI components, all of them are interactive in the Fima file and ready-to-use in Unity.","breadcrumbs":[{"label":"Features"}]},{"id":"k6PmuJjUdCHIZXiOYFMW","title":"Icons","pathname":"/features/icons","siteSpaceId":"sitesp_mnklf","description":"FloatGrids uses the Material Icons set. However you can perfectly use your own.","breadcrumbs":[{"label":"Features"}]},{"id":"4QLIQ9mVmhvaM2PGkciq","title":"Logo","pathname":"/features/logo","siteSpaceId":"sitesp_mnklf","description":"Assign your logo sprite in the prefab Product Logo so it'll get applied automatically to the menu.","breadcrumbs":[{"label":"Features"}]},{"id":"m1QjG22EthKofnJHVe1G","title":"UX Resources","pathname":"/features/ux-resources","siteSpaceId":"sitesp_mnklf","description":"FloatGrids includes UX features to ensure that panels are properly positioned relative to the user's point of view and that their size fits perfectly within the user's field of vision.","breadcrumbs":[{"label":"Features"}]},{"id":"LXVnHCQEUYbVIPB73tUO","title":"Overview","pathname":"/ui-components/overview","siteSpaceId":"sitesp_mnklf","description":"","breadcrumbs":[{"label":"UI Components"}]},{"id":"gHlo5lbwoJJhSAxBVMrk","title":"Alert","pathname":"/ui-components/alert","siteSpaceId":"sitesp_mnklf","description":"Use alerts to give feedback to your user. Alerts can be placed either in the space or on the panels.","breadcrumbs":[{"label":"UI Components"}]},{"id":"2aDaB7MimignZIziEB2H","title":"Badges","pathname":"/ui-components/badges","siteSpaceId":"sitesp_mnklf","description":"Badges are utilized to indicate states atop other components. FloatGrids offer 10 variants of badges for you to utilize, depending on the case.","breadcrumbs":[{"label":"UI Components"}]},{"id":"axzNX8GDQpV10Aue7TVW","title":"Button","pathname":"/ui-components/button","siteSpaceId":"sitesp_mnklf","description":"FloatGrids has 10 different styles of buttons plus three styles for icon buttons.","breadcrumbs":[{"label":"UI Components"}]},{"id":"8AsGLiDY516dyi4HLaFW","title":"Card","pathname":"/ui-components/card","siteSpaceId":"sitesp_mnklf","description":"Cards help in organizing content in a more visual way. Use Cards to visually separate one content to the other and make scanning easier for your users.","breadcrumbs":[{"label":"UI Components"}]},{"id":"eGBWg2j3mV4PGFGIvDjs","title":"Checkbox","pathname":"/ui-components/checkbox","siteSpaceId":"sitesp_mnklf","description":"","breadcrumbs":[{"label":"UI Components"}]},{"id":"IXKRXaHL7bO4hiE31vHf","title":"Contextual Menu","pathname":"/ui-components/contextual-menu","siteSpaceId":"sitesp_mnklf","breadcrumbs":[{"label":"UI Components"}]},{"id":"Yomz2qL5sv7hT7RaNLgr","title":"Divider","pathname":"/ui-components/divider","siteSpaceId":"sitesp_mnklf","description":"","breadcrumbs":[{"label":"UI Components"}]},{"id":"vHmtU3JDm8JCIxW7xnwV","title":"Dropdown","pathname":"/ui-components/dropdown","siteSpaceId":"sitesp_mnklf","description":"","breadcrumbs":[{"label":"UI Components"}]},{"id":"GYF1XEmYrfgNLGnplSDQ","title":"Empty State","pathname":"/ui-components/empty-state","siteSpaceId":"sitesp_mnklf","description":"Empty states are used to guide users towards an action. They take over a screen before items have been edded to it. Empty states have 4 main sections: Icon, title, description and actions.","breadcrumbs":[{"label":"UI Components"}]},{"id":"n5oP9Np0bcZNU7pQGgPu","title":"Keyboard and keypad (WIP)","pathname":"/ui-components/keyboard-and-keypad-wip","siteSpaceId":"sitesp_mnklf","description":"We're still working on the keyboard but so far you have it assembled in both Figma and Unity","breadcrumbs":[{"label":"UI Components"}]},{"id":"THIO5UCUWxT7L7OQGp5X","title":"List","pathname":"/ui-components/list","siteSpaceId":"sitesp_mnklf","description":"","breadcrumbs":[{"label":"UI Components"}]},{"id":"r9TUM1G34baMi3KKTzD1","title":"Navigation","pathname":"/ui-components/navigation","siteSpaceId":"sitesp_mnklf","description":"","breadcrumbs":[{"label":"UI Components"}]},{"id":"xlrXKAAsI31CXjxSYozi","title":"Modal","pathname":"/ui-components/modal","siteSpaceId":"sitesp_mnklf","description":"","breadcrumbs":[{"label":"UI Components"}]},{"id":"eQdvEtQ8zhHYNLhZIFNA","title":"Panel","pathname":"/ui-components/panel","siteSpaceId":"sitesp_mnklf","description":"Panels are where the UI resides. Use the empty panel to create new views or utilize the pre-made panels to fill them with your content. Pre-made panels adjust in size so they can be used in any layout","breadcrumbs":[{"label":"UI Components"}]},{"id":"ysMU6CyzkqMEkRrSMxB9","title":"Profile Image","pathname":"/ui-components/profile-image","siteSpaceId":"sitesp_mnklf","description":"","breadcrumbs":[{"label":"UI Components"}]},{"id":"8CR8EHENqF97nNInsXt2","title":"Progress","pathname":"/ui-components/progress","siteSpaceId":"sitesp_mnklf","description":"","breadcrumbs":[{"label":"UI Components"}]},{"id":"zz6ssqGcECo1Ju2CheQj","title":"Radio Group","pathname":"/ui-components/radio-group","siteSpaceId":"sitesp_mnklf","description":"","breadcrumbs":[{"label":"UI Components"}]},{"id":"TZfjhS823fOM66JBWRGI","title":"Slider","pathname":"/ui-components/slider","siteSpaceId":"sitesp_mnklf","description":"","breadcrumbs":[{"label":"UI Components"}]},{"id":"VGWOiRJIENu1GEhHSUWc","title":"Text Field","pathname":"/ui-components/text-field","siteSpaceId":"sitesp_mnklf","description":"","breadcrumbs":[{"label":"UI Components"}]},{"id":"RKNhER1EivP618Vf0b5T","title":"Table","pathname":"/ui-components/table","siteSpaceId":"sitesp_mnklf","description":"The FloatGrids table component is a versatile feature that enables you to swiftly generate various types of tables containing badges, profile images, action sections, or plain text.","breadcrumbs":[{"label":"UI Components"}]},{"id":"1Zy1zkFfHhCFvRXzAxEf","title":"Tooltip","pathname":"/ui-components/tooltip","siteSpaceId":"sitesp_mnklf","description":"","breadcrumbs":[{"label":"UI Components"}]},{"id":"EsVzUOfS5fq410bdhp51","title":"Toggle","pathname":"/ui-components/toggle","siteSpaceId":"sitesp_mnklf","description":"","breadcrumbs":[{"label":"UI Components"}]},{"id":"AjxT0oEeMbPagy8lvPYL","title":"Onboarding View","pathname":"/views/onboarding-view","siteSpaceId":"sitesp_mnklf","description":"Onboarding template is ready for you to use. Just change images and texts and indicate the steps.","breadcrumbs":[{"label":"Views"}]},{"id":"jQJCkQnIBBHJ0xoGjPv0","title":"Gallery View","pathname":"/views/gallery-view","siteSpaceId":"sitesp_mnklf","description":"Add as many images as you want, they will organize automatically","breadcrumbs":[{"label":"Views"}]},{"id":"6ColDTeaGAi7ajY7fGGX","title":"Sidebar view","pathname":"/views/sidebar-view","siteSpaceId":"sitesp_mnklf","description":"Responsive Sidebar panel","breadcrumbs":[{"label":"Views"}]},{"id":"zttmfyBhELHn2gZIvQK4","title":"Settings View","pathname":"/views/settings-view","siteSpaceId":"sitesp_mnklf","description":"Add as many images as you want, they will organize automatically","breadcrumbs":[{"label":"Views"}]},{"id":"6U0PwsQXYpRegAgmiG0J","title":"Navbar Panel","pathname":"/views/navbar-panel","siteSpaceId":"sitesp_mnklf","breadcrumbs":[{"label":"Views"}]},{"id":"CEx1F9bPHldNLL1MzgkA","title":"Layouts","pathname":"/layouts/layouts","siteSpaceId":"sitesp_mnklf","description":"FloatGrids has 7 ready to use layouts for you to choose which one fits best your app. They are ready in a scene.","breadcrumbs":[{"label":"Layouts"}]}]}