Web Site Tasarımcısı Mısınız? O Zaman Bu Yazıyı Kesin Görmeniz Lazım!

Web Site Tasarımcısı Mısınız? O Zaman Bu Yazıyı Kesin Görmeniz Lazım!

10 Ocak 2018 0 Yazar: Mustafa BÜKÜLMEZ
Toplam Görüntülenme : 48
Yaklaşık okuma süresi : 14 DK
Web Site Tasarımcısı Mısınız? O Zaman Bu Yazıyı Kesin Görmeniz Lazım!
5 (100%) 2 Oy

Web Site Tasarımcısı Mısınız? O Zaman Bu Yazıyı Kesin Görmeniz Lazım! Evet! Bu yazı tamamen web tasarımcıları için hazırlanıştır. Her web tasarımcısının alet çantasında olması gereken ve web tasarımcıların bilmesi gerekenler bazı şeylere bu yazıda değinmek istedim.

HTML kategorisine ait diğer yazılarım için tıklayınız.

CSS kategorisine ait diğer yazılarım için tıklayınız.

Web tasarımcılarının genel sorunlarından birisidir Sosyal Medya ikonları.. Aynı türde tüm ikonları bulmak yada renkleri doğru olanları bulmak. Bu konu hep sıkıntı olmuştur. Şimdi sizlere, popüler sosyal medya ikonlarını ve logolarının renk kodlarını vereceğim. Öyle ki bu ikonlar bir “image” dosyası değil vektör dosyasıdır. Yani istediğiniz kadar büyütün küçültün ikonlar piksel piksel olmayacaktır. Web tasarım araçlarınıza bunları kaydetmeyi unutmayın. 😉

Sosyal Medya Renk Hex ve RGB Kodları

Facebook                  
Hex: #3b5998
RGB: 59, 89, 152

.btn-Facebook {
    color: #ffffff;
    background-color: #3b5998;
    border-color: #3b5998;
    width: 100px;
    height: 23px;
}
.label-Facebook {
    background-color: #3b5998;
}
.badge-Facebook {
    background-color: #3b5998;
    color: #ffffff;
}

 

     Twitter
Hex: #00aced
RGB: 0, 172, 237

.btn-Twitter {
    color: #ffffff;
    background-color: #00aced;
    border-color: #00aced;
    width: 100px;
    height: 23px;
}
.label-Twitter {
    background-color: #00aced;
}
.badge-Twitter {
    background-color: #00aced;
    color: #ffffff;
}

web tasarımcıları   Google+
      Hex: #dd4b39
      RGB: 221, 75, 57

.btn-GooglePlus {
    color: #ffffff;
    background-color: #dd4b39;
    border-color: #dd4b39;
    width: 100px;
    height: 23px;
}
.label-GooglePlus {
    background-color: #dd4b39;
}
.badge-GooglePlus {
    background-color: #dd4b39;
    color: #ffffff;
}

 

web tasarımcıları YouTube
      Hex: #bb0000
      RGB: 187, 0, 0

.btn-YouTube {
    color: #ffffff;
    background-color: #bb0000;
    border-color: #bb0000;
    width: 100px;
    height: 23px;
}
.label-YouTube {
    background-color: #bb0000;
}
.badge-YouTube {
    background-color: #bb0000;
    color: #ffffff;
}

 

  web tasarımcılar forum    Linkedin Blue
      Hex: #007bb6
      RGB: 0, 123, 182

.btn-LinkedinBlue {
    color: #ffffff;
    background-color: #007bb6;
    border-color: #007bb6;
    width: 100px;
    height: 23px;
}
.label-LinkedinBlue {
    background-color: #007bb6;
}
.badge-LinkedinBlue {
    background-color: #007bb6;
    color: #ffffff;
}

web tasarımcılar forumInstagram
      Hex: #517fa4
      RGB: 81, 127, 164

.btn-Instagram {
    color: #ffffff;
    background-color: #517fa4;
    border-color: #517fa4;
    width: 100px;
    height: 23px;
}
.label-Instagram {
    background-color: #517fa4;
}
.badge-Instagram {
    background-color: #517fa4;
    color: #ffffff;
}

 

web tasarımcılar forum Pinterest
      Hex: #cb2027
      RGB: 203, 32, 39

.btn-Pinterest {
    color: #ffffff;
    background-color: #cb2027;
    border-color: #cb2027;
    width: 100px;
    height: 23px;
}
.label-Instagram {
    background-color: #cb2027;
}
.badge-Instagram {
    background-color: #cb2027;
    color: #ffffff;
}

 

web tasarımcılar forumVine
      Hex: #00bf8f
      RGB: 0, 191, 143

.btn-Vine {
    color: #ffffff;
    background-color: #00bf8f;
    border-color: #00bf8f;
    width: 100px;
    height: 23px;
}
.label-Vine {
    background-color: #00bf8f;
}
.badge-Vine {
    background-color: #00bf8f;
    color: #ffffff;
}

 

web tasarımcılar forum Snapchat
      Hex: #fffc00
      RGB: 255, 252, 0

.btn-Snapchat {
    color: #444;
    background-color: #fffc00;
    border-color: #fffc00;
    width: 100px;
    height: 23px;
}
.label-Snapchat {
    background-color: #fffc00;
}
.badge-Snapchat {
    background-color: #fffc00;
    color: #444;
}

 

web tasarımcıların bilmesi gerekenlerQuora
      Hex: #a82400
      RGB: 168, 36, 0

.btn-Quora {
    color: #ffffff;
    background-color: #a82400;
    border-color: #a82400;
    width: 100px;
    height: 23px;
}
.label-Quora {
    background-color: #a82400;
}
.badge-Quora {
    background-color: #a82400;
    color: #ffffff;
}

 

web tasarımcıların bilmesi gerekenlerFlickr
      Hex: #ff0084
      RGB: 255, 0, 132

.btn-Flickr {
    color: #ffffff;
    background-color: #ff0084;
    border-color: #ff0084;
    width: 100px;
    height: 23px;
}
.label-Flickr {
    background-color: #ff0084;
}
.badge-Flickr {
    background-color: #ff0084;
    color: #ffffff;
}

 

web tasarımcıların bilmesi gerekenlerTumblr
      Hex: #32506d
      RGB: 50, 80, 109

.btn-Tumblr {
    color: #ffffff;
    background-color: #32506d;
    border-color: #32506d;
    width: 100px;
    height: 23px;
}
.label-Tumblr {
    background-color: #32506d;
}
.badge-Tumblr {
    background-color: #32506d;
    color: #ffffff;
}

 

web tasarımcıların bilmesi gerekenlerVK
      Hex: #45668e
      RGB: 69, 102, 142

.btn-VK {
    color: #ffffff;
    background-color: #45668e;
    border-color: #45668e;
    width: 100px;
    height: 23px;
}
.label-VK {
    background-color: #45668e;
}
.badge-VK {
    background-color: #45668e;
    color: #ffffff;
}

 

web tasarımcıların bilmesi gerekenlerVimeo
      Hex: #aad450
      RGB: 170, 212, 80

.btn-Vimeo {
    color: #ffffff;
    background-color: #aad450;
    border-color: #aad450;
    width: 100px;
    height: 23px;
}
.label-Vimeo {
    background-color: #aad450;
}
.badge-Vimeo {
    background-color: #aad450;
    color: #ffffff;
}

 

web tasarımcıların bilmesi gerekenler Foursquare
      Hex: #0072b1
      RGB: 0, 114, 177

.btn-Foursquare {
    color: #ffffff;
    background-color: #0072b1;
    border-color: #0072b1;
    width: 100px;
    height: 23px;
}
.label-Foursquare {
    background-color: #0072b1;
}
.badge-Foursquare {
    background-color: #0072b1;
    color: #ffffff;
}

CSS dosyanıza bu kodları ekledikten sonra projenize font-awesome font dosyasını da ekleyin. Logoları oradan alacağız. Font diyoruz ama aslında gerçek bir font değil. Vektörel logolar dosyası desek daha doğru olur çünkü bu dosyada sadece sosyal medya logoları değil envai çeşit ikon bulunmaktadır. Bu sayede sosyal medya ikonlarını bulmakla yada tek dosyada hepsini içeren img dosyalarında pikseller ile uğraşmayacağız. Şimdi de size font-awesome.css dosyasındaki sosyal medya ikonlarını göstermenizi sağlayacak kodları veriyorum.

<i class="fa fa-facebook "></i><span>facebook</span>
<i class="fa fa-facebook-square "></i><span>facebook Kare içinde</span>
<i class="fa fa-twitter "></i><span>twitter</span>
<i class="fa fa-twitter-square "></i><span>twitter Kare içinde</span>
<i class="fa fa-google-plus "></i><span>google-plus</span>
<i class="fa fa-google-plus-square "></i><span>google-plus Kare içinde</span>
<i class="fa fa-youtube "></i><span>youtube</span>
<i class="fa fa-youtube-play "></i><span>youtube oynat</span>
<i class="fa fa-youtube-square "></i><span>youtube Kare içinde</span>
<i class="fa fa-linkedin "></i><span>linkedin</span>
<i class="fa fa-linkedin-square "></i><span>linkedin Kare içinde</span>
<i class="fa fa-instagram "></i><span>instagram</span>
<i class="fa fa-pinterest "></i><span>pinterest</span>
<i class="fa fa-pinterest-square "></i><span>pinterest Kare içinde</span>
<i class="fa fa-flickr "></i><span>flickr</span>
<i class="fa fa-tumblr "></i><span>tumblr</span>
<i class="fa fa-tumblr-square "></i><span>tumblr Kare içinde</span>
<i class="fa fa-pinterest "></i><span>pinterest</span>
<i class="fa fa-pinterest-square "></i><span>pinterest Kare içinde</span>
<i class="fa fa-vk "></i><span>vk</span>                           
<i class="fa fa-vimeo-square "></i><span>vimeo Kare içinde</span>
<i class="fa fa-foursquare "></i><span>foursquare</span>                            

<i class="fa fa-turkish-lira "></i><span>TL</span>

Nasıl göründüklerinin ekran görüntüsünü de şuraya bırakayım.

web tasarımcılar

 

Buraya kadar ki konumuz sosyal medya ile ilgiliydi. Sıra geldi diğer konulara…


Flat Tasarımlar İçin Renkler

Son zamanlarda flat tasarımlar moda oldu. Herşeye ütü basılmış gibi… 😀 Tabi sadece tasarımlar ütülenmedi, flat tasarımlar için daha soğuk ve mat renkler de ortaya çıktı. Peki her rengin soğuk ve mat halini nereden bulacaksınız?. Telaşa gerek yok.. Bu iş açılmış bir site vereceğim size. Bu sitede her renk için flat tonlar bulunmaktadır.

Sitemizin URL’si : http://www.flatuicolorpicker.com/

Şöyle de bir ekran görüntüsü bırakayım..

 


Backgraound Generator

Evet!. Devam edelim.. Sırada sitelerimiz için güzel bg’ler oluşturabileceğimiz bir siteyi de vereyim.

Site URL’si: http://bg.siteorigin.com/

Siteye giriyorsunuz, sol taraftaki menüyü kullanarak istediğiniz renk ve desende bg’nizi oluşturuyorsunuz. Size küçük bir img dosyası veriyor. Bu img dosyasını da background-image olarak ve repeat olarak veriyorsunuz. İşte bu kadar.


Hazır Script

Ya bana hazır scriptler de lazım oluyor diyorsanız bu site tam size göre…

Site URL’si: http://scripti.org/


Flat Tasarımlar İçin Renkler

Flat renkleri anında site üzerinde deneyip, renk hakkında inanılmaz bilgileri görmek istiyorsanız bu site de tam size göre.

Site URL’si: http://www.color-hex.com

 


Web sitesi yaparken div’e gölge vereyim gibi şeyler diyorsanız ozaman bu siteyi mutlaka deneyin. 😉

Tabi bu sitedeki tek şey gölge oluşturmak değil… 😉

Site URL’si: https://www.cssmatic.com/box-shadow


Bootstrap Button ve Label

Bootstrap ile uğraşanlar hazır butonları bilirler. Ya dostum beni beni uğraştırma sadece butonlar labeller var mı diyorsanız ozaman buyrunnn! 😀

/* Buttons için */
.btn {
  display: inline-block;
  padding: 6px 12px;
  margin-bottom: 0;
  font-size: 14px;
  font-weight: normal;
  line-height: 1.428571429;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  cursor: pointer;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 4px;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
       -o-user-select: none;
          user-select: none;
}

.btn:focus {
  outline: thin dotted;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}

.btn:hover,
.btn:focus {
  color: #333333;
  text-decoration: none;
}

.btn:active,
.btn.active {
  background-image: none;
  outline: 0;
  -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
          box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
}

.btn.disabled,
.btn[disabled],
fieldset[disabled] .btn {
  pointer-events: none;
  cursor: not-allowed;
  opacity: 0.65;
  filter: alpha(opacity=65);
  -webkit-box-shadow: none;
          box-shadow: none;
}

.btn-default {
  color: #333333;
  background-color: #ffffff;
  border-color: #cccccc;
}

.btn-default:hover,
.btn-default:focus,
.btn-default:active,
.btn-default.active,
.open .dropdown-toggle.btn-default {
  color: #333333;
  background-color: #ebebeb;
  border-color: #adadad;
}

.btn-default:active,
.btn-default.active,
.open .dropdown-toggle.btn-default {
  background-image: none;
}

.btn-default.disabled,
.btn-default[disabled],
fieldset[disabled] .btn-default,
.btn-default.disabled:hover,
.btn-default[disabled]:hover,
fieldset[disabled] .btn-default:hover,
.btn-default.disabled:focus,
.btn-default[disabled]:focus,
fieldset[disabled] .btn-default:focus,
.btn-default.disabled:active,
.btn-default[disabled]:active,
fieldset[disabled] .btn-default:active,
.btn-default.disabled.active,
.btn-default[disabled].active,
fieldset[disabled] .btn-default.active {
  background-color: #ffffff;
  border-color: #cccccc;
}

.btn-default .badge {
  color: #ffffff;
  background-color: #fff;
}

.btn-primary {
  color: #ffffff;
  background-color: #428bca;
  border-color: #357ebd;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.open .dropdown-toggle.btn-primary {
  color: #ffffff;
  background-color: #3276b1;
  border-color: #285e8e;
}

.btn-primary:active,
.btn-primary.active,
.open .dropdown-toggle.btn-primary {
  background-image: none;
}

.btn-primary.disabled,
.btn-primary[disabled],
fieldset[disabled] .btn-primary,
.btn-primary.disabled:hover,
.btn-primary[disabled]:hover,
fieldset[disabled] .btn-primary:hover,
.btn-primary.disabled:focus,
.btn-primary[disabled]:focus,
fieldset[disabled] .btn-primary:focus,
.btn-primary.disabled:active,
.btn-primary[disabled]:active,
fieldset[disabled] .btn-primary:active,
.btn-primary.disabled.active,
.btn-primary[disabled].active,
fieldset[disabled] .btn-primary.active {
  background-color: #428bca;
  border-color: #357ebd;
}

.btn-primary .badge {
  color: #428bca;
  background-color: #fff;
}

.btn-warning {
  color: #ffffff;
  background-color: #f0ad4e;
  border-color: #eea236;
}

.btn-warning:hover,
.btn-warning:focus,
.btn-warning:active,
.btn-warning.active,
.open .dropdown-toggle.btn-warning {
  color: #ffffff;
  background-color: #ed9c28;
  border-color: #d58512;
}

.btn-warning:active,
.btn-warning.active,
.open .dropdown-toggle.btn-warning {
  background-image: none;
}

.btn-warning.disabled,
.btn-warning[disabled],
fieldset[disabled] .btn-warning,
.btn-warning.disabled:hover,
.btn-warning[disabled]:hover,
fieldset[disabled] .btn-warning:hover,
.btn-warning.disabled:focus,
.btn-warning[disabled]:focus,
fieldset[disabled] .btn-warning:focus,
.btn-warning.disabled:active,
.btn-warning[disabled]:active,
fieldset[disabled] .btn-warning:active,
.btn-warning.disabled.active,
.btn-warning[disabled].active,
fieldset[disabled] .btn-warning.active {
  background-color: #f0ad4e;
  border-color: #eea236;
}

.btn-warning .badge {
  color: #f0ad4e;
  background-color: #fff;
}

.btn-danger {
  color: #ffffff;
  background-color: #d9534f;
  border-color: #d43f3a;
}

.btn-danger:hover,
.btn-danger:focus,
.btn-danger:active,
.btn-danger.active,
.open .dropdown-toggle.btn-danger {
  color: #ffffff;
  background-color: #d2322d;
  border-color: #ac2925;
}

.btn-danger:active,
.btn-danger.active,
.open .dropdown-toggle.btn-danger {
  background-image: none;
}

.btn-danger.disabled,
.btn-danger[disabled],
fieldset[disabled] .btn-danger,
.btn-danger.disabled:hover,
.btn-danger[disabled]:hover,
fieldset[disabled] .btn-danger:hover,
.btn-danger.disabled:focus,
.btn-danger[disabled]:focus,
fieldset[disabled] .btn-danger:focus,
.btn-danger.disabled:active,
.btn-danger[disabled]:active,
fieldset[disabled] .btn-danger:active,
.btn-danger.disabled.active,
.btn-danger[disabled].active,
fieldset[disabled] .btn-danger.active {
  background-color: #d9534f;
  border-color: #d43f3a;
}

.btn-danger .badge {
  color: #d9534f;
  background-color: #fff;
}

.btn-success {
  color: #ffffff;
  background-color: #5cb85c;
  border-color: #4cae4c;
}

.btn-success:hover,
.btn-success:focus,
.btn-success:active,
.btn-success.active,
.open .dropdown-toggle.btn-success {
  color: #ffffff;
  background-color: #47a447;
  border-color: #398439;
}

.btn-success:active,
.btn-success.active,
.open .dropdown-toggle.btn-success {
  background-image: none;
}

.btn-success.disabled,
.btn-success[disabled],
fieldset[disabled] .btn-success,
.btn-success.disabled:hover,
.btn-success[disabled]:hover,
fieldset[disabled] .btn-success:hover,
.btn-success.disabled:focus,
.btn-success[disabled]:focus,
fieldset[disabled] .btn-success:focus,
.btn-success.disabled:active,
.btn-success[disabled]:active,
fieldset[disabled] .btn-success:active,
.btn-success.disabled.active,
.btn-success[disabled].active,
fieldset[disabled] .btn-success.active {
  background-color: #5cb85c;
  border-color: #4cae4c;
}

.btn-success .badge {
  color: #5cb85c;
  background-color: #fff;
}

.btn-info {
  color: #ffffff;
  background-color: #5bc0de;
  border-color: #46b8da;
}

.btn-info:hover,
.btn-info:focus,
.btn-info:active,
.btn-info.active,
.open .dropdown-toggle.btn-info {
  color: #ffffff;
  background-color: #39b3d7;
  border-color: #269abc;
}

.btn-info:active,
.btn-info.active,
.open .dropdown-toggle.btn-info {
  background-image: none;
}

.btn-info.disabled,
.btn-info[disabled],
fieldset[disabled] .btn-info,
.btn-info.disabled:hover,
.btn-info[disabled]:hover,
fieldset[disabled] .btn-info:hover,
.btn-info.disabled:focus,
.btn-info[disabled]:focus,
fieldset[disabled] .btn-info:focus,
.btn-info.disabled:active,
.btn-info[disabled]:active,
fieldset[disabled] .btn-info:active,
.btn-info.disabled.active,
.btn-info[disabled].active,
fieldset[disabled] .btn-info.active {
  background-color: #5bc0de;
  border-color: #46b8da;
}

.btn-info .badge {
  color: #5bc0de;
  background-color: #fff;
}

.btn-link {
  font-weight: normal;
  color: #428bca;
  cursor: pointer;
  border-radius: 0;
}

.btn-link,
.btn-link:active,
.btn-link[disabled],
fieldset[disabled] .btn-link {
  background-color: transparent;
  -webkit-box-shadow: none;
          box-shadow: none;
}

.btn-link,
.btn-link:hover,
.btn-link:focus,
.btn-link:active {
  border-color: transparent;
}

.btn-link:hover,
.btn-link:focus {
  color: #2a6496;
  text-decoration: underline;
  background-color: transparent;
}

.btn-link[disabled]:hover,
fieldset[disabled] .btn-link:hover,
.btn-link[disabled]:focus,
fieldset[disabled] .btn-link:focus {
  color: #999999;
  text-decoration: none;
}

.btn-lg {
  padding: 10px 16px;
  font-size: 18px;
  line-height: 1.33;
  border-radius: 6px;
}

.btn-sm {
  padding: 5px 10px;
  font-size: 12px;
  line-height: 1.5;
  border-radius: 3px;
}

.btn-xs {
  padding: 1px 5px;
  font-size: 12px;
  line-height: 1.5;
  border-radius: 3px;
}

.btn-block {
  display: block;
  width: 100%;
  padding-right: 0;
  padding-left: 0;
}
<span id="mce_marker" data-mce-type="bookmark" data-mce-fragment="1">​</span>
.label {
  display: inline;
  padding: .2em .6em .3em;
  font-size: 75%;
  font-weight: bold;
  line-height: 1;
  color: #ffffff;
  text-align: center;
  white-space: nowrap;
  vertical-align: baseline;
  border-radius: .25em;
}
.label[href]:hover,
.label[href]:focus {
  color: #ffffff;
  text-decoration: none;
  cursor: pointer;
}

.label:empty {
  display: none;
}

.btn .label {
  position: relative;
  top: -1px;
}

.label-default {
  background-color: #999999;
}

.label-default[href]:hover,
.label-default[href]:focus {
  background-color: #808080;
}

.label-primary {
  background-color: #428bca;
}

.label-primary[href]:hover,
.label-primary[href]:focus {
  background-color: #3071a9;
}

.label-success {
  background-color: #5cb85c;
}

.label-success[href]:hover,
.label-success[href]:focus {
  background-color: #449d44;
}

.label-info {
  background-color: #5bc0de;
}

.label-info[href]:hover,
.label-info[href]:focus {
  background-color: #31b0d5;
}

.label-warning {
  background-color: #f0ad4e;
}

.label-warning[href]:hover,
.label-warning[href]:focus {
  background-color: #ec971f;
}

.label-danger {
  background-color: #d9534f;
}

.label-danger[href]:hover,
.label-danger[href]:focus {
  background-color: #c9302c;
}
 
CSS
/* Badges için */

.badge {
  display: inline-block;
  min-width: 10px;
  padding: 3px 7px;
  font-size: 12px;
  font-weight: bold;
  line-height: 1;
  color: #ffffff;
  text-align: center;
  white-space: nowrap;
  vertical-align: baseline;
  background-color: #999999;
  border-radius: 10px;
}

.badge:empty {
  display: none;
}

.btn .badge {
  position: relative;
  top: -1px;
}

a.badge:hover,
a.badge:focus {
  color: #ffffff;
  text-decoration: none;
  cursor: pointer;
}

a.list-group-item.active > .badge,
.nav-pills > .active > a > .badge {
  color: #428bca;
  background-color: #ffffff;
}

.nav-pills > li > a > .badge {
  margin-left: 3px;
}
.btn-default .badge {
  color: #ffffff;
  background-color: #fff;
}
.btn-primary .badge {
  color: #428bca;
  background-color: #fff;
}
.btn-warning .badge {
  color: #f0ad4e;
  background-color: #fff;
}
.btn-danger .badge {
  color: #d9534f;
  background-color: #fff;
}
.btn-success .badge {
  color: #5cb85c;
  background-color: #fff;
}
.btn-info .badge {
  color: #5bc0de;
  background-color: #fff;
}
<span id="mce_marker" data-mce-type="bookmark" data-mce-fragment="1">​</span>

 

Evet dostlar şimdilik bu kadar elime böyle doneler geçtikçe bu yazımı da güncellerim. Her web tasarımcılar forumlarında böyle şeyleri bir arada bulamazsınız. 🙂

HTML kategorisine ait diğer yazılarım için tıklayınız.

CSS kategorisine ait diğer yazılarım için tıklayınız.


Zamanla sağlam bir makale olur. Sağlıcakla ve takipte kalın. 😉

Liseden, Ağ Sistemleri ve Yönetimi bölümünden mezun oldum. Üniversiteden (2 yıllık), Bilgisayar Programcılığı bölümünden mezun oldum. Şuanda da AÖF, Yönetim Bilişim Sistemleri bölümünde okumaktayım.

Uzmanlık alanlarım; Windows Sistemleri, HTML, CSS, C# ve SQL’dir.

Hobi olarak uğraştığım genel konular, Photoshop, After Affects, Corel Draw’dır.Film, YABANCI dizi, Anime izlemeyi ve Manga okumayı severim. Arkadaşlarımla yürüyüş yapmayı ve grup olarak aktivitelere gitmeyi severim. Geri kalan zamanlarımın tümü bilgisayar karşısında geçer.