chore: add doc on pixel perfection (#16539)
This commit is contained in:
parent
7282ba04bc
commit
4801342a42
|
@ -24,6 +24,7 @@
|
|||
|
||||
[Patching](patching.md)
|
||||
|
||||
[Creating a pixel perfect UI](pixel-perfection.md)
|
||||
|
||||
## Testing
|
||||
|
||||
|
|
Binary file not shown.
After Width: | Height: | Size: 564 KiB |
|
@ -0,0 +1,17 @@
|
|||
# Pixel Perfection
|
||||
The Status Mobile team aims to align the design implementation perfectly according to a given screens respective Figma design spec.
|
||||
|
||||
Currently the Figma Designs match up with an "iPhone 11 Pro" screen size.
|
||||
|
||||
To test your implementation is correct you can take the following steps
|
||||
|
||||
- Open a new Figma file so that you have write privileges.
|
||||
- Copy in the component or screen from the Figma file.
|
||||
|
||||
- Using the "iPhone 11 Pro" simulator (it is the default now) you take a screenshot of your component and paste it into your Figma file.
|
||||
|
||||
- To get the right size, set your screenshot to width 375px
|
||||
|
||||
![](images/pixel-perfection/layer-width.png)
|
||||
|
||||
- Lower the opacity so you can see it sitting on top of the Figma mock ups.
|
Loading…
Reference in New Issue