In this challenge you will be provided with some screen shots from cloud.coreweave.com along with the colors used. You will then be given a list of specifications for a new feature design. Your submission will be a Figma (or something comparable) mockup of the feature UI meeting all of the specifications and matching our current brand. Bonus points for mobile and tablet views!
Complete as many of the specs as you can in time you are allotted. Any questions feel free to reach out.
A Storage Volume is essentially a virtual hard drive. Users can create different size volumes with various configurations and attach them to other virtual deployments in their namespace. The Storage Volume Management page will provide a list of all existing volumes already created in the namespace, as well as the ability to add, edit, delete, and clone each volume.
Each volume has the following attributes:
- Name - (lowercase and no spaces)
- Type - (either NVMe or SSD)
- Filesystem Type - ("Shared Filesystem" or "Block Storage")
- Age/Date created
- Size - (e.g. 100 Gi)
- Cost per month (e.g. $0.35)
- Amount used - (e.g. 50 Gi)
- Region - (location where actual storage hardware lives - Either ORD1 (Chicago), EWR1 (New York) or LAS1 (Las Vegas))
- Tags - This can be any number of tags with any key/value pair (e.g.
some/tag: Completed
). Note, users must be able to add/delete tags (keys and values) as well - Status - Either "Bound" (ready) or "Unbound" (not set up yet).
- New Volume - a user must be able to provide the name, region, type, filesystem type, size as well as any number of tags. As they ar updating the info, there should be a price per month value showing the cost of their settings. You can use
$0.35
as the value. - Edit Volume - A user must be able to increase their volume size, as well ass add/remove tags. Their price change from previous cost per month to their current cost should be displayed. Could use
$0.35
and$0.45
respectively. - Delete and Clone - just an "Are you sure?" type message
Find a way to have a simple list display and also allow the option for a more detailed view, displaying more of the attributes. You can determine what to show in what view and how to show it. This can be a modal, a dropdown, or anything else.
We want to display total cost per month for all volumes somewhere, as well as total used and total remaining
There should an input to search for an existing volume/type etc.
Some columns in list should be sortable at your discretion.
Below is the actual spec used to create this feature. Feel free to use this as much or as little as you like. All the information you need should be shown above, but these inital descriptions and screen shot ideas may be helpful:
The first view in /volume-management
should be the list of all the volumes that are available and in the users namespace. I think this should just be a few rows(table rows, etc) that give some general information about the PVC. I think everything we would want to show for this is in the screenshot below except we might was to have a dedicated region
key?? (The defined region will be in the storage class so not sure how important that is)
A rough example of what this could look like:
I like this, we can put all of the per volume actions like this(clone, edit, delete):
In the detailed view it might be good for us to display any of the information that is not outlined in the general list view. This can include things like labels, annotations, owner references, etc. I also think for this we should use a modal instead of a separate view like I've posted below but Example Detailed View:
A view to edit/manage the Volume (On our version we will want to dumb this down, if someone knew how to edit YAMLs they wouldn't need the UI in the first place 😛 ). I will update this w/ the exact editable values we will want for this. We should also show pricing changes/current price
We also will want a creation modal (really the whole point) that will allow users to create Volumes in a nice UI. We can most likely share inputs from here and the Edit modal/view. We want to include pricing data for this.
This will allow users to create clones of Volumes. Useful for backing up VMs. Can be a pretty simple modal, will update with the exact requirements. Include pricing