Description from extension meta
Jebkurā tīmekļa lapā izmēriet pikseļa precizitātes attālumus un režģus.
Image from store
Description from store
Pikseļu precizitāte ir lieliska dizaina klusais varonis. Viena pikseļa nepareiza izlīdzināšana var izjaukt režģa ritmu, likt tekstam šķist necentrētam vai likt visam komponentam izskatīties “gandrīz pareizi”, bet ne gluži. Grid Ruler Lite nodrošina front-end izstrādātājiem, UI/UX dizaineriem, kvalitātes nodrošināšanas testētājiem un ikvienam, kam rūp vizuālais noslīpējums, tūlītēju mērīšanas rīku komplektu pārlūkprogrammā — nav nepieciešama sarežģīta dizaina programmatūra, nav pārblīvētu DevTools paneļu un nav ekrānuzņēmumu, kas sajaukti ārējās lietotnēs. Ar vienu klikšķi paplašinājums jebkuras tīmekļa lapas augšpusē uzliek maināma izmēra lineālu, režģa piesaistes vadlīnijas un papildu bāzes režģus, lai jūs varētu pārbaudīt atstarpes, verificēt 8 punktu režģus un dažu sekunžu laikā fiksēt pierādījumus par izkārtojuma kļūdām.
Kas padara Grid Ruler Lite īpašu?
Aktivizēšana ar vienu klikšķi, atlaišana ar vienu klikšķi
Noklikšķiniet uz rīkjoslas ikonas (vai aktivizējiet pārlūkprogrammas tastatūras iestatījumos iestatīto saīsni), un paplašinājums ievadīs vieglu elementu.<canvas> pārklājums, kas iekapsulēts savā Shadow-DOM. Jūsu lapas CSS nevar traucēt, un pārklājums nekad nemaina testējamo DOM koku. Noklikšķiniet vēlreiz, un visas vadlīnijas, režģis un etiķetes pazūd — nav nepieciešama lapas atkārtota ielāde, nav atlikušo notikumu klausītāju.
Kāpēc jūs to vēlēsities savā instrumentu komplektā
Ietaupiet laiku: Lai mērītu atstarpes DevTools rīkā, ir nepieciešams urbties ligzdotos lodziņos un mentāli pievienot apmaļu un malu vērtības. Grid Ruler Lite vizuāli parāda attālumus ar vienu vilkšanas reizi.
Kļūdu samazināšana: pamaniet sīkas atstarpju regresijas, pirms tās sasniedz izstrādes stadiju vai, vēl ļaunāk, ražošanas stadiju, īpaši reaģējošos pārtraukumpunktos, kur kvalitātes nodrošināšanas (QA) acis ne vienmēr nonāk uzmanības centrā.
Uzlabojiet sadarbību: dizaineri var pārklāt 8 punktu režģi tieši uz izvietotās versijas un kopīgot ekrānuzņēmumu, sniedzot izstrādātājiem precīzu pikseļu atgriezenisko saiti bez Figma komentāriem.
Saglabājiet koncentrēšanos: Nav nepieciešams Photoshopā nospiest taustiņu Alt un Tab vai atvērt Sketch failus tikai pogas mērīšanai. Viss notiek tiešsaistes lapā tieši tā, kā to redz lietotāji.
Izglītošana un dokumentēšana: Produktu vadītāji un tehniskie rakstnieki var demonstrēt izkārtojuma darbību ar lineālu ekrānuzņēmumiem, padarot specifikāciju dokumentus skaidrākus visām ieinteresētajām personām.
Mērķa lietotāju grupas
Lietotāju grupa
Priekšējās programmatūras izstrādātāji
Nepieciešams pārbaudīt CSS atstarpes, flexbox atstarpes un komponentu izlīdzinājumu pāri pārtraukuma punktiem. Velciet lineālus, piestipriniet pie malām, fiksējiet vadlīnijas, eksportējiet ekrānuzņēmumus PR pārskatiem.
Lietotāja saskarnes/lietotāja pieredzes dizaineri
Jāapstiprina, ka izstrādātāju veidotās versijas atbilst 8 punktu vai 10 punktu dizaina sistēmām. Pārklājiet bāzes līnijas režģus, mēriet starplikas, kopīgojiet anotētus PNG attēlus.
Kvalitātes nodrošināšanas testētāji
Ziņojiet par pikseļa precizitātes kļūdām ar skaidriem pierādījumiem
Ātri mērījumi un ekrānuzņēmumu uzņemšana ar vienu taustiņu nonāk tieši kļūdu izsekotājos
Satura redaktori un projektu vadītāji
Pārbaudiet virsraksta apli, reklāmas vietu atstarpes un karšu izkārtojumus CMS vadītās lapās. Netehnisks pārklājums ļauj izvairīties no DevTools sarežģītības.
Pedagogi un studenti
Māciet dizaina principus, režģa teoriju un adaptīvos izkārtojumus tiešraidē pārlūkprogrammā. Vizuālas demonstrācijas reāllaikā bez ārējiem rīkiem.