Ity fampiharana tranonkala ity dia manova sary rehetra amin'ny nofy Retro Fever - Tsy ilaina Photoshop

Ao amin'nyTutorials teo aloha, dia nampianatra ny fampiharana izahay mba hiasa amin'ny references sy palettes. Ankehitriny, fotoana ny hanampy safidy bebe kokoa ho an'ny fanamafisana tsara ny loko sy ny vokatra.

Hanolotra fitaovana vaovao vitsivitsy isika izay ahafahan'ny fanitsiana sary mora kokoa. Ankoatra izany, hikaroka modely mainty vaovao, HSV, izay miasa amin'ny loko tsy mitovy amin'ny RGB sy LAB. Ity modely ity dia mamela mora kokoa ny fanitsiana toetra toy ny hatsaran-tarehy, saturation, ary fahazavana, izay mahatonga azy manokana mahasoa amin'ny fanitsiana loko amin'ny sary. Ity fanavaozana ity dia hanokatra fahaiza-manao vaovao sy fahafahana ho an'ny fikarohana.

Ny code manontolo dia azo jerena ao amin'nyNy rohyNy

Adjusting the Number of Colors in the Extracted Palette

Efa nahita isika fa ny famerana ny paleta dia afaka manova ny endriky ny sary.

Ho an'ny fanaraha-maso matanjaka kokoa sy ny fanitsiana sary fanitsiana, dia hanampy ny fahafahana mifehy ny isan'ny loko navoaka avy amin'ny sary. Ankehitriny, azonao atao ny mametraka mazava tsara ny isan'ny loko no mampiseho ao amin'ny sary, mamela ny fanaraha-maso tsara kokoa amin'ny vokatra sary. Ity endri-javatra ity dia tena mahasoa rehefa miasa amin'ny paletina ho an'ny famoronana filalaovana, satria ny fanovana ny isan'ny loko dia azo ampiharina amin'ny sehatra maro amin'ny famolavolana asa.

Ny fampiharana amin'izao fotoana izao dia manana slider izay ahafahanao misafidy ny isan'ny loko novolavolaina avy amin'ny sary (ao amin'ny 10 ka hatramin'ny 20). Ity fanitsiana ity dia miteraka ny valin'ny filtre ary manampy amin'ny hahazoana vokatra tsara kokoa.

<div style={{ marginBottom: 12 }}>
  <label>Number of Colors</label>
  <input
    type="range"
    min="10"
    max="20"
    value={colorCount}
    onChange={(e) => setColorCount(Number(e.target.value))}
    style={{ width: "100%" }}
  />
</div>

Izahay dia hanandrana ny sary mahatalanjona avy amin'i So Sasaki hoTonga any TokioManana safidy maro amin'ny loko sy ny loko, izay mahatonga azy io ho lohahevitra tsara ho an'ny fikarohana.

Eto ambany dia azonao atao ny mampitaha ny endriky ny sary amin'ny paleta amin'ny habeny samihafa.

Filter Intensity Slider

Mba hahatonga ny fanodinana dingana mora kokoa, dia hanampy slider mba hanara-maso ny hery ny palette fampiharana ho an'ny sary. ity slider ity dia mamela anao hanova ny fitoviana eo amin'ny sary voalohany sy ny palette.

Tsindrio fotsiny ny haingam-pandeha tianao ary tsindrio ny "Apply filter".

<div style={{ marginBottom: 16 }}>
  <label style={{ display: "block", marginBottom: 6 }}>Filter Intensity</label>
  <input
    type="range"
    min="0"
    max="100"
    value={intensity}
    onChange={(e) => setIntensity(Number(e.target.value))}
    style={{ width: "100%" }}
  />
</div>

How does it work?

Rehefa voatendry ho 100% ny haavo, ny sary dia hamerina tanteraka amin'ny fampiasana ny loko avy amin'ny paleta voafidy. Ny ambany kokoa ny haavo, dia kely kokoa ny fiantraikan'ny paleta eo amin'ny sary, mamela anao hitazona ny loko voalohany.

HSV Color Model

HSV (Hue, saturation, Value) dia iray amin'ireo loko malaza indrindra, matetika ampiasaina mba hanehoana ny loko amin'ny lafiny amin'ny loko, ny satiation, ary ny mazava.

Ny
• Ny loko (loko): Izany dia maneho ny loko fototra (ohatra mena, maitso, maitso, sns), voafaritra amin'ny degrees avy amin'ny 0 ka hatramin'ny 360.
Ny
• Mifototra amin'ny habetsahan'ny mainty ao amin'ny loko: 100% dia mainty tanteraka, ary 0% dia mainty.
Ny
• Value (fahafaham-po): Izany dia maneho ny fahazavan'ny loko. Ny tahan'ny 0% dia manome mainty, raha ny 100% dia ny dikan'ny loko.
Ny

Differences from RGB and LABNy :

Ny
• Tsy mitovy amin'ny RGB, izay mampifandray ny loko mifototra amin'ny herinaratra, mainty sy mainty, ny HSV dia mifototra amin'ny fahatsapan'ny olombelona.
Ny
• Raha oharina amin'ny LAB, izay mampiasa modely matematika sarotra kokoa ho an'ny fampisehoana mazava tsara ny loko amin'ny toe-javatra samihafa, ny HSV dia tsotra kokoa sy mora ampiasaina.
Ny

Sample code ho an'ny famerenana RGB amin'ny HSV:

function rgbToHsv(r, g, b) {
  r /= 255;
  g /= 255;
  b /= 255;
  
  const max = Math.max(r, g, b);
  const min = Math.min(r, g, b);
  const delta = max - min;

  let h = 0, s = 0, v = max;

  if (delta !== 0) {
    s = delta / max;
    if (r === max) {
      h = (g - b) / delta;
    } else if (g === max) {
      h = 2 + (b - r) / delta;
    } else {
      h = 4 + (r - g) / delta;
    }
    h *= 60;
    if (h < 0) h += 360;
  }

  return [h, s * 100, v * 100];
}

Ity ambany ity dia ohatra amin'ny sary ao amin'ny paleta mitovy, fa amin'ny loko samihafa.

Contrast Slider

Ny fahasamihafana dia mifandray amin'ny fahasamihafana eo amin'ny fahazavana sy ny maizina indrindra amin'ny sary. Ny fanitsiana ny fahasamihafana dia ahafahanao manatsara na hampihenana izany fahasamihafana izany.

How does contrast adjustment work?

Rehefa mampitombo ny mifanohitra, ny faritra mainty amin'ny sary dia ho mainty kokoa, ary ny faritra mainty dia ho mainty kokoa. Ity vokatra ity dia afaka mahatonga ny sary ho hita matanjaka sy mainty kokoa, manatsara ny fiantraikany.

Ohatra code ho an'ny fiovana ny mifanohitra:

const applyContrast = (r, g, b, contrast) => {
  const contrastFactor = (259 * (contrast + 255)) / (255 * (259 - contrast));
  r = contrastFactor * (r - 128) + 128;
  g = contrastFactor * (g - 128) + 128;
  b = contrastFactor * (b - 128) + 128;
  return [r, g, b];
};

Algorithm DescriptionNy :

Ny algorithm mifanohitra dia mampiasa singa izay miankina amin'ny tahan'ny mifanohitra amin'izao fotoana izao. Ity singa ity dia ampiharina amin'ny singa tsirairay amin'ny loko (mainty, mainty ary mainty), manova ny fahazavan'izy ireo mifototra amin'ny tahan'ny mifanohitra.

Noise Slider

Ho an'ireo izay te-hahazo fahafinaretana kely, dia nanampy slider feo izahay. Ny fametrahana feo amin'ny sary dia manampy amin'ny famoronana fiantraikany amin'ny sary vintage na mahatonga ny sary hahatsapa "tsy velona". Ity fiantraikany ity dia ampiasaina mba hanakana ny tsy fahombiazan'ny sary na hanampy ny tsipika ara-tantara amin'ny sary.

How does the noise work?

Ny haino aman-jery dia mamela anao hanara-maso ny habetsahan'ny variation azo ampiharina amin'ny loko ny tsirairay ny pixel ao amin'ny sary. Ny avo kokoa ny haino aman-jery, ny lehibe kokoa ny habetsahan'ny fanovana azo ampiharina amin'ny sary.

Rehefa mampiditra feo amin'ny sary, dia ampidirina endrika madinika sy azo antoka amin'ny RGB valin'ny pixel tsirairay, izay mahatonga ny fiantraikany. Ity fiantraikany ity dia mety ho maivana na mahery vaika, miankina amin'ny habetsahan'ny feo ampiasaina. Izany dia afaka manampy amin'ny famoronana ny sary amin'ny endrika tsara kokoa na mamolavola ny endriky ny sary taloha amin'ny famaritana ambany.

const applyNoise = (r, g, b, noise) => {
  r += Math.random() * noise - noise / 2;
  g += Math.random() * noise - noise / 2;
  b += Math.random() * noise - noise / 2;
  return [r, g, b];
};

Algorithm DescriptionNy :

Izany dia mamorona ny fiantraikany amin'ny fiovan'ny loko tsy tapaka, manome ny sary endrika mahatsiravina na mahatsiravina. Amin'ity tranga ity, isika dia mamolavola ny fandikan-teny, izay tsy misy ifandraisany amin'ny sarimihetsika tena izy na ny feo. Na izany aza, ny filalaovana nomerika voalohany (ohatra ireo ampiasaina amin'ny finday voalohany toy nySary avy amin'ny Sony Ericsson W810) miasa amin'ny fitsipika mitovy.

Amin'ny alàlan'ny fanaraha-maso ny habetsaky ny feo, ny mpampiasa dia afaka manandrana amin'ny ambaratonga samihafa amin'ny haavo mba hahatratrarana vokatra samihafa na hanamafisana ny tsy fahampian'ny sary.

Ary mazava ho azy, dia nanampy bokotra Reset Settings izahay mba hanesorana ny filalaovana rehetra ary hiverina amin'ny sary voalohany.

Nandritra ny lahatsoratra, dia nanadihady ny fototry ny fanitsiana loko izahay ary nanadihady fitaovana sy teknika samihafa ho an'ny fampiharana azy. Nandritra izany fotoana izany dia nanadihady ny fomba handrosoana sy hanova ny loko, ny fiantraikany amin'ny fahasamihafana, ny famokarana sy ny feo, ary ny fomba miasa amin'ny endrika loko samihafa - RGB, LAB, ary HSV.

Ny fanitsiana ny loko dia ampahany manan-danja amin'ny fanodinana sary, mamela antsika hanatsarana ny fahatsapana endrika, hampitombo ny singa sasantsasany, ary hahatratra ny fandriampahalemana eo amin'ny loko.

Zava-dehibe ny manamarika fa ny fanitsiana ny loko sy ny fanoharana dia tsy misy fiantraikany fotsiny amin'ny endriky ny sary, fa koa ny fomba fijery azy io.