Servicecore Design System

Durum göstergeleri

Durum göstergeleri, 'önem derecesi bilgisi'nin kullanıcılara iletilmesinde önemli bir yöntemdir. Farklı şekiller ve renkler, kullanıcıların durumu hızlı bir şekilde değerlendirip belirlemesine ve buna göre yanıt vermesine olanak tanır.
Bir gösterge, bir sayfa öğesini vurgular ve kullanıcıyı, kullanıcının dikkat etmesi gereken bir şey hakkında bilgilendirir. Çoğu zaman gösterge, belirli bir öğede değişiklik olduğunu gösterir. Doğrulama hatalarını veya bildirimleri, değişiklikleri veya güncellemeleri bildirmek için sıklıkla kullanılırlar. Ayrıca kendi başlarına da kullanılabilirler. Göstergeler, kullanıcının dikkatini doğası gereği dinamik olan bir içerik parçasına veya kullanıcı arayüzü öğesine çekmeyi amaçlayan görsel ipuçlarıdır.

Yüksek öncelikli

Bu göstergeler, kullanıcının derhal harekete geçmesi gerektiğine işaret eder; yani sistemde bir düzensizlik vardır, bir arıza vardır veya kullanıcının potansiyel olarak yıkıcı bir eylemi onaylaması gerekir. Örnekler arasında uyarılar, istisnalar, onaylar ve hatalar yer alır.

İkon
Anlam
Renk
Açıklama ve kullanım

Failure

Red 60 — #da1e28

Red 50 — #fa4d56

Derhal ilgilenilmesi gereken bir süreç arızasını belirtir

Şunun için kullanılır: başarısız süreçler, acil durumlar, acil uyarılar

Warning

Red 60 — #da1e28

Red 50 — #fa4d56

Derhal ilgilenilmesi gereken bir hatayı (genellikle satır içi) belirtir

Şunun için kullanılır: uyarılar, hatalar, uyarılar, arıza

Warning alt

Red 60 — #da1e28

Red 50 — #fa4d56

'Warning' ile aynı anlamı taşır

Misuse

Red 60 — #da1e28

Red 50 — #fa4d56

Kullanılamadığını, yanlış bir kullanım durumunu (özellikle kullanım kılavuzunda) veya iptal edilmiş bir çalıştırmayı belirtir

Şunun için kullanılır: yanlış kullanım, kullanılamama, iptal

Caution major

Orange 40 — #ff832b

Bir eşiğin aşıldığını gösterir; kritik bir olay tetiklenmeden önce kullanıcıyı uyarır (yalnızca 'Dikkat' ile birlikte kullanılır)

Şunun için kullanılır: büyük dikkat, ciddi durumlar, kritik istikrarsızlık

Caution minor

Yellow 20 — #f1c21b

Daha ciddi bir arızayı önlemek için düzeltici eylem gerektiren, hizmeti etkilemeyen arıza durumunun varlığını belirtir.

Kullanım amacı: küçük uyarı, önleme, kararsızlık

Orta derecede öncelikli

Herhangi bir acil kullanıcı eylemi gerekmediğinde veya bir kullanıcı eylemine geri bildirim sağlamak için bu göstergeleri kullanın. Bazı örnekler, teşekkür ve ilerleme göstergelerini içerir.

İkon
Anlam
Renk
Açıklama ve kullanım

Undefined

Purple 60 — #8a3ffc

Purple 50 — #a56eff

Kabul edilebilir aralığın dışında olan veya yanlış biçimlendirilmiş bir değeri belirtir

Şunun için kullanılır: deneysel çalışma, aykırı değerler

Normal

Green 50 — #24a148

Green 40 — #42be65

Bildirilen bir veya daha fazla alarmın kararlılığını veya silindiğini gösterir; hiçbir sorunun mevcut olmadığı anlamına gelir

Şunun için kullanılır: başarı, tamamlanma, kararlılık, aktif durumlar

Normal alt

Green 50 — #24a148

Green 40 — #42be65

'Normal' ile aynı anlamı taşır ancak daha çok veri tablolarında ve kapalı alanlarda kullanılır

Success

Blue 70 — #0043ce

Blue 50 — #4589ff

Bir sürecin sonundaki başarıyı belirtir

Şunun için kullanılır: başarı, tamamlama

In progress

Blue 70 — #0043ce

Blue 50 — #4589ff

Bir işlemin başladığını ancak çalışmasının tamamlanmadığını belirtir (işin durumu değiştiğinde simgenin yerini 'onay işareti' veya 'uyarı' simgesi alacaktır)

Şunun için kullanılır: tamamlanmamış, devam eden işlemler

Incomplete

Blue 70 — #0043ce

Blue 50 — #4589ff

Aşamalı bir sürecin başladığını ancak henüz bitmediğini belirtir

Şunun için kullanılır: tamamlanmamış görevler

Not started

Blue 70 — #0043ce

Blue 50 — #4589ff

Bir işin veya adımın henüz başlatılmadığını belirtir

Şunun için kullanılır: yeniden başlatılan görevler veya devre dışı bırakılan işlemler

Pending

Gray 60 — #6f6f6f

Gray 50 — #8d8d8d

Bir işin başladığını ancak kaynakların yetersiz olması nedeniyle planlanamayacağını belirtir

Şunun için kullanılır: süresiz bekletme

Düşük öncelikli

Bir şey görüntülenmeye hazır olduğunda, sistem geri bildirimi için veya son etkileşimden bu yana bir şeyin değiştiğini belirtmek için bu göstergeleri kullanın. Bazı örnekler, açıklayıcı veya ek bilgiler sunan araç ipucu tetikleyicilerini ve pasif bildirimleri içerir.

İkon
Anlam
Renk
Açıklama ve kullanım

Unknown

Gray 60 — #6f6f6f

Gray 50 — #8d8d8d

Bir nesnenin durumunun bilinmediğini belirtir

Şunun için kullanılır: bilinmiyor, tanımlanmamış durum

Help

Gray 60 — #6f6f6f

Gray 50 — #8d8d8d

Ek destek veya SSS içeriğinin mevcut olduğunu belirtir

Şunun için kullanılır: yardım, rehberlik, istisnalar

Information

Blue 70 — #0043ce

Blue 50 — #4589ff

Ek (gerekli olmayan) bilgilerin mevcut olduğunu belirtir

Şunun için kullanılır: ek bilgi, istisnalar

Information alt

Blue 70 — #0043ce

Blue 50 — #4589ff

'Information' ile aynı anlamı taşır

Şekil göstergeleri

Şekil göstergeleri, bir cihazın, özelliğin veya sürümün durumunu belirtmenin standart ve tutarlı bir yolunu oluşturmak için renk şeklini ve metni birleştirir. Simgeler mevcut değil. Bu şekiller ayrıca ağ diyagramları gibi belirli diyagramlarda ve veri görselleştirmelerinde de görülür.


Şekiller yalnızca daha büyük simge kaplarından türetilen en temel geometrilerdir, dolayısıyla küçük boyutlarda kolayca ayırt edilebilirler. Şekil göstergeleri çok küçük oldukları için ana hatlarıyla mevcut değildir.

İkon
Anlam
Renk
Açıklama ve kullanım

Failure

Red 60 — #da1e28

Red 50 — #fa4d56

Derhal ilgilenilmesi gereken ciddi bir süreç arızasını veya hatasını belirtir

Şunlar için kullanılır: kritik arızalar, acil durumlar, acil uyarılar, kullanımdan kaldırma ve iptal

Critical severity

Red 60 — #da1e28

Red 50 — #fa4d56

Kritik önem derecesine sahip önceliği, kritik önem derecesine sahip nesneyi (IP gibi) veya kritik veri ihlali riskini belirtir; 1-10 arası bir ölçeğe dayalı

Şunun için kullanılır: kritik (10) öncelik, kritik risk, kritik önem derecesine sahip uyarılar

High severity

Red 60 — #da1e28

Red 50 — #fa4d56

Yüksek önem derecesine sahip önceliği, yüksek önem derecesine sahip nesneyi (IP gibi) veya yüksek veri ihlali riskini belirtir; 1-10 arası bir ölçeğe dayalı

Şunun için kullanılır: yüksek öncelik (7-9), yüksek risk, yüksek önem derecesine sahip uyarılar

Medium severity

Orange 40 — #ff832b

Orta düzeydeki önceliği, orta düzeydeki nesneyi (IP gibi) veya orta düzeyde veri ihlali riskini belirtir; 1-10 arası bir ölçeğe dayalı

Şunun için kullanılır: orta öncelik (4-6), orta risk, orta şiddette uyarılar

Low severity

Yellow 20 — #f1c21b

Düşük önem derecesine sahip önceliği, düşük önem derecesine sahip nesneyi (IP gibi) veya düşük veri ihlali riskini belirtir; 1-10 arası bir ölçeğe dayalı

Şunun için kullanılır: düşük öncelik (0-3), düşük risk, düşük önem derecesine sahip uyarılar

Caution

Yellow 20 — #f1c21b

Güvenlik riski/şiddet ölçeği kullanılmadığında, bu, hizmeti etkilemeyen arıza durumunun varlığını belirtmek için kullanılabilir.

Şunun için kullanılır: küçük uyarı, önleme, istikrarsızlık

Undefined

Purple 60 — #8a3ffc

Purple 50 — #a56eff

Kabul edilebilir aralığın dışında olan veya yanlış biçimlendirilmiş bir değeri belirtir

Şunun için kullanılır: deneysel çalışma, aykırı değerler

Stable

Green 50 — #24a148

Green 40 — #42be65

Bildirilen bir veya daha fazla alarmın kararlılığını veya silindiğini gösterir; hiçbir sorunun mevcut olmadığı anlamına gelir

Şunun için kullanılır: başarı, tamamlanma, kararlılık, aktif durumlar

New

Blue 70 — #0043ce

Blue 50 — #4589ff

Yeni bileşenleri, özellikleri veya içerik parçalarını belirtir

Şunun için kullanılır: yeni öğeler, ek bilgiler

Information

Blue 70 — #0043ce

Blue 50 — #4589ff

Ek bilgilerin mevcut olduğunu belirtir (bu tabloda dikkate alınmayan durumlar için uyarlanabilir şekilde kullanılabilir)

Şunun için kullanılır: ek bilgi, joker karakter

Incomplete

Blue 70 — #0043ce

Blue 50 — #4589ff

Bir işlemin başladığını ancak çalışmasının tamamlanmadığını veya bir kullanıcı görevinin tamamlanmadığını belirtir

Şunun için kullanılır: tamamlanmamış, devam eden işlemler

Draft

Gray 60 — #6f6f6f

Gray 50 — #8d8d8d

Bir işin başlatılmadığını, bir işin taslak durumunu veya devre dışı bırakılan bir süreci belirtir

Şunun için kullanılır: başlatılmamış görevler, taslaklar, devre dışı bırakılan süreçler

Rozetler

Öğeleri, onları tanımlayan anahtar sözcüklerle etiketlemek, kategorilere ayırmak veya düzenlemek için rozetleri kullanın.

Rozet
Arkaplan Rengi
Yazı Rengi

Red

Red

Red 20 — #ffd7d9

Red 70 — #a2191f

Red 70 — #a2191f

Red 20 — #ffd7d9

Magenta

Magenta

Magenta 20 — #ffd6e8

Magenta 70 — #9f1853

Magenta 70 — #9f1853

Magenta 20 — #ffd6e8

Purple

Purple

Purple 20 — #e8daff

Purple 70 — #6929c4

Purple 70 — #6929c4

Purple 20 — #e8daff

Blue

Blue

Blue 20 — #d0e2ff

Blue 70 — #0043ce

Blue 70 — #0043ce

Blue 20 — #d0e2ff

Cyan

Cyan

Cyan 20 — #bae6ff

Cyan 70 — #00539a

Cyan 70 — #00539a

Cyan 20 — #bae6ff

Teal

Teal

Teal 20 — #9ef0f0

Teal 70 — #005d5d

Teal 70 — #005d5d

Teal 20 — #9ef0f0

Green

Green

Green 20 — #a7f0ba

Green 70 — #0e6027

Green 70 — #0e6027

Green 20 — #a7f0ba

Cool gray

Cool gray

Cool gray 20 — #dde1e6

Cool gray 70 — #4d5358

Cool gray 70 — #4d5358

Cool gray 20 — #dde1e6

Warm gray

Warm gray

Warm gray 20 — #e5e0df

Warm gray 70 — #565151

Warm gray 70 — #565151

Warm gray 20 — #e5e0df

Gray

Gray

Gray 20 — #e0e0e0

Gray 70 — #525252

Gray 70 — #525252

Gray 20 — #e0e0e0

Örnek kullanımlar

Önem Seviyesi
ID
Konu
Oluş.. tarih
Oluş.. saat

Critical

83465

Security issues on client agent.

29/05/2023

19:16:21

Medium

83123

Low bandwith warning arises frequently.

05/02/2023

13:34:23

Low

82314

Repeating error on finance modules.

17/01/2023

15:23:32

Critical

88960

Cloud Services are too slow.

01/02/2023

12:56:00

Durumlar

3 durum ilgi gerektiriyor

Görevlerim

1

11

2

Olaylar kayıtlarım

8

11

İstek kayıtlarım

2

10

12

Varlıklarım

14

Etkileşim kayıtları

1