juyeonk-project05-wallpaper

sketch

var x = 0;
var y = 0;
var THeight = 54.6;
var TBase = 63;


function setup() {
    createCanvas(441, 328.5);
    background (253, 226, 222);


//small white triangles in the furthermost back: odd-number rows
for (var x = 0; x <= width; x += TBase) {
        for (var y = 0; y < height; y += 2 * THeight) {
            noFill();
            stroke (255, 180);
            strokeWeight (2);
            triangle (x, y + THeight, x + TBase/2, y, x + TBase, y + THeight);
        }
}

//small white triangles in the furthermost back: even-number rows
for (var x = 0; x <= width; x += TBase) {
        for (var y = -THeight; y < height; y += 2 * THeight) {
            noFill();
            stroke (255, 180);
            strokeWeight (2);
            triangle (x - TBase/2, y + THeight, x, y, x + TBase/2, y + THeight);
        }

}
    
//orange hexagons: first and third rows
for (var x = -TBase/2*3; x <= width; x += 2 * TBase) {
        for (var y = -THeight; y < height; y += 4 * THeight) {
            fill(247, 148, 29,60);
            beginShape();
            vertex(x + TBase/2, y);
            vertex(x, y + THeight);
            vertex(x + TBase/2, y + 2 * THeight);
            vertex(x + TBase / 2 * 3, y + 2 * THeight);
            vertex(x + 2 * TBase, y + THeight);
            vertex(x + TBase / 2 * 3, y);
            endShape(CLOSE);
        }
}

//small white hexagons: even-number rows
for (var x = -TBase/3; x <= width; x += TBase) {
        for (var y = 0; y < height; y += 2 * THeight) {
            fill(255, 180);
            noStroke();
            beginShape();
            vertex(x, y  + THeight);
            vertex(x + TBase/6, y + THeight/3*4);
            vertex(x + TBase/2, y + THeight / 3 * 4);
            vertex(x + TBase / 3 * 2, y + THeight);
            vertex(x + TBase/2, y + THeight/3*2);
            vertex(x + TBase/6, y + THeight / 3 * 2);
            endShape(CLOSE);
        }
}
 
//small white hexagons: odd-number rows
for (var x = -TBase/6*5; x <= width; x += TBase) {
        for (var y = -THeight; y < height; y += 2 * THeight) {
            fill(255, 180);
            noStroke();
            beginShape();
            vertex(x, y  + THeight);
            vertex(x + TBase/6, y + THeight/3*4);
            vertex(x + TBase/2, y + THeight / 3 * 4);
            vertex(x + TBase / 3 * 2, y + THeight);
            vertex(x + TBase/2, y + THeight/3*2);
            vertex(x + TBase/6, y + THeight / 3 * 2);
            endShape(CLOSE);
        }
}

//orange hexagons: second and fourth rows
for (var x = -TBase/2; x <= width; x += 2 * TBase) {
        for (var y = THeight; y < height; y += 4 * THeight) {
            fill(247, 148, 29, 50);
            beginShape();
            vertex(x + TBase/2, y);
            vertex(x, y + THeight);
            vertex(x + TBase/2, y + 2 * THeight);
            vertex(x + TBase / 2 * 3, y + 2 * THeight);
            vertex(x + 2 * TBase, y + THeight);
            vertex(x + TBase / 2 * 3, y);
            endShape(CLOSE);
        }
}

    
//red triangles: first and third rows
for (var x = -2 * TBase; x <= width; x += 2 * TBase) {
        for (var y = 0; y < height; y += 4 * THeight) {
            fill(237,28,36,40);
            stroke(237, 28, 36, 90);
            triangle (x + TBase/2, y + 2 * THeight, x + TBase/2*3, y, x + TBase/2*5,y + 2 * THeight);
        }
}

    
//red triangles: second row
for (var x = -TBase; x <= width; x += 2 * TBase) {
        for (var y = 2 * THeight; y < height; y += 4 * THeight) {
            fill(237,28,36,40);
            stroke(237, 28, 36, 90);
            triangle (x + TBase/2, y + 2 * THeight, x + TBase/2*3, y, x + TBase/2*5,y + 2 * THeight);
        }
}

    
}

 

Since I wasn’t allowed to make a dynamic art for this project I decided to spice things up by increasing the complexity of the visual elements, or at least by attempting to do so.

First I drew out a pattern that uses hexagons and triangles as its primary visual elements and then transferred it into a code. While doing so, the nest for loops that I learned during the second part of the assignment came very useful.

One thing that I wish I could do was making a mirrored or a rotated array. In that way I could have created cool kaleidoscopic patterns, instead of having the same exact patterns laid out  side by side.

hschung-Project-05

sketch

// Heidi Chung
// Section A
// hschung@andrew.cmu.edu
// Project-05

// (245, 185, 140) peach
// (200, 90, 90)


function setup() {
    createCanvas(400, 400);
    background(172, 234, 245);
}

function draw() {
    spaceBunnies();
}

function spaceBunnies() {
    var tw = 60;
    var th = 75;
    var oy = 50;
    var ox = 50;
    var amt = 10;

    for (var rows = 0; rows < 5; rows++) {
        for (var col = 0; col < amt; col++) {
            var py = 10 + oy + rows * th;
            var px = ox + col * tw; //th and tw = bounding box of circles
            noStroke();
            fill(255); //bun face // 255, 200, 200 medium pink
            ellipse(px-90, py + 5, 55, 50);

            fill(0); // both eyes
            ellipse(px-105, py +5, 7, 5);
            ellipse(px-140, py, 7, 5);

            fill(245, 185, 140); //nose
            ellipse(px-154, py, 7, 5);

            fill(255, 200, 200 ); // mouth
            ellipse(px-152, py + 12, 13, 15);

            fill(255); // both ears
            ellipse(px-105, py-25, 13, 25);
            ellipse(px-140, py-25, 13, 25);

            fill(255, 200, 200); // ear insides
            ellipse(px-105, py -25, 8, 18);
            ellipse(px-140, py-25, 8, 18);

        }
    }
}





I started out by sketching some doodles, and I thought I might do a pattern involving bunnies or space, and moon/star shapes. I decided to go with the bunnies because I thought it was cute and work well if it was repeated as a motif. I went for a simple, cute wallpaper, one that I could see being used for a phone background. If I were to do this again, I would like to try making some of the bunnies with different expressions for points of interest. Doing this project helped me strengthen my familiarity with for loops again- but I would like to solidly understand it inside and out, so I can manipulate them with more finesse.

mmirho – Project 5 – Wallpaper

Leaves!

I spent most of my time getting the construction of the leaf right, but after that, it was just making a simple alternating grid of them, like we’ve done in class before.

sketch

//Maxwell Mirho
//Section A
//mmirho@andrew.cmu.edu
//Project 5

function setup() {
    createCanvas(400, 400);
    background(10, 170, 260);
}

function drawLeaf(tipX, tipY) {

    fill(150,250,150);

    fill(10, 170, 260);
    arc(tipX + 30, tipY + 95, 60, 60, 1.5708 + 0.2, 3.14159, OPEN);
    fill(150, 250, 150);
    //Stem

    //Leaf tip
    triangle(tipX, tipY, tipX + 30, tipY + 70, tipX - 30, tipY + 70);

    //Leaf butt
    arc(tipX, tipY + 75, 60, 55, -0.3, 3.14159 + 0.3, OPEN);

    stroke(100,200,100);

    //1st (Top) leaf contour)
    arc(tipX, tipY + 51, 60, 60, 0.83, 2.3, OPEN);

    //2nd
    arc(tipX, tipY + 40, 50, 50, 0.83, 2.3, OPEN);

    //3rd
    arc(tipX, tipY + 29, 40, 40, 0.83, 2.3, OPEN);

    line(tipX, tipY + 88, tipX, tipY + 20);
    line(tipX - 1, tipY + 88, tipX - 1, tipY + 20);
    stroke(0);
    //Center leaf contour
    
}

function draw() {
    
    for (var x = 0 ; x < 6 ; x += 1) {
        for (var y = 0 ; y < 6 ; y += 1) {
            //Creates a grid

            push();
            translate(x*100, y*100);
            //Move the tip of the leaf to the grid

            if ((y%2) == 0) {
                rotate(-0.5);
            } else {
                rotate(0.5);
            }
            //Twists the leaf the opposite way if the row is an even number
            
            drawLeaf(0,0);
            //Draws an entire leaf!
            pop();

        }

    }
}

thlai-Project-05-Wallpaper

I wanted to create a pond-like wallpaper with fish and water ripples. At first, I had my fish going straight to the right, horizontally, but decided it looked too static. I rotated/translated instead, to make it seem like the fish were following each other in a stream.

sketch

// Tiffany Lai
// 15-104, Section A
// thlai@andrew.cmu.edu
// Project 05 - Wallpaper

function setup() {
    createCanvas(480, 480);
    noLoop();
    angleMode(DEGREES);
    ellipseMode(CENTER);
}

function draw() {
    background(245, 241, 219);

    var fx = 25;
    var fy = 10;
    var num = 7; // number of fish in each row
    var offset = 10;

    // CREATE ROWS OF FISH
    for (var y= 0; y < 9; y ++){
        for (var x = 0; x < num; x ++) {
            if(y%2==1){ // every other  row
                num = 3;
                offset = 100;
            } else {
                num = 4;
                offset = 10;   
        }
            translate(5, 0);
            rotate(x);
            fish(fx*5*x + offset, fy+60*y-20); // draw the fishes
        }
    }   

    // CREATE WATER DROPS
    var droplet = 100;
    for(var i = 0; i < 6; i++){
        push();
        stroke(255, 190);
        strokeWeight(2);
        noFill();
        ellipse(400, 10, 10+i*(5+i*10), 10+i*(5+i*10)); // right ripples
        ellipse(150, 200, i*40, i*40); // middle ripples
        ellipse(0, 50, droplet-i*20, droplet-i*20); // top ripples
        pop();
    }
}

// FISH FUNCTION
function fish(fx, fy) {

    push();
    translate(fx, fy);
    rotate(30);
    noStroke();

    fill(random(210, 255), 110, 74); // fill with random orange
    quad(20, 27, 38, 39, 28, 52, 53, 37); // tail
    triangle(71, 22, 78, 21, 83, 27); // top fin
    triangle(68, 51, 82, 42, 79, 49); // bottom fin

    fill(random(50,100), random(90,150), random(130,180)); // fill with random blue
    beginShape(); // body
        vertex(53, 37);
        vertex(78, 27);
        vertex(92, 29);
        vertex(100, 37);
        vertex(95, 43);
        vertex(77, 43);
    endShape();
    pop();
}

Matthew Erlebacher Project-05

Wallpaper

// Matthew Erlebacher
// Section B
// merlebac@andrew.cmu.edu
// Project-05

function setup() {
    createCanvas(450, 450);
    noStroke();
}

function draw() {
    background(0);
    for (var centerX1 = 25; centerX1 < width; centerX1 += 100) {
        for (var centerY1 = 25; centerY1 < height; centerY1 += 100) {
            // Creates pattern for upper left area
            fill(0, 0, 255);
            ellipse(centerX1, centerY1, 40, 40);
            // Creates blue circle

            fill(255, 0, 0);
            rectMode(CENTER);
            rect(centerX1, centerY1, 22.5, 22.5);
            // Creates red square

            fill(0, 255, 0);
            push();
            translate(centerX1, centerY1);
            rotate(radians(45));
            rectMode(CENTER);
            rect(0, 0, 20, 20);
            pop();
            // Creates green rotated square

            fill(0);
            ellipse(centerX1, centerY1, 10, 10);
            // Creates black circle
        }
    }

    for (var centerX2 = 75; centerX2 < width; centerX2 += 100) {
        for (var centerY2 = 75; centerY2 < height; centerY2 += 100) {
            // Creates pattern for lower right area
            fill(0, 0, 255);
            ellipse(centerX2, centerY2, 40, 40);
            // Creates blue circle

            fill(255, 0, 0);
            rectMode(CENTER);
            rect(centerX2, centerY2, 22.5, 22.5);
            // Creates red square

            fill(0, 255, 0);
            push();
            translate(centerX2, centerY2);
            rotate(radians(45));
            rectMode(CENTER);
            rect(0, 0, 20, 20);
            pop();
            // Creates rotated green sqare

            fill(0);
            ellipse(centerX2, centerY2, 10, 10);
            // Creates black circle
        }
    }

    for (var centerX3 = 75; centerX3 < width; centerX3 += 100) {
        for (var centerY3 = 25; centerY3 < height; centerY3 += 100) {
            // Creates pattern for upper right area
            fill(125);
            push();
            translate(centerX3, centerY3);
            rotate(radians(45));
            rectMode(CENTER);
            rect(0, 0, 30, 30);
            pop();
            // Creates rotated gray square

            fill(0);
            rectMode(CENTER);
            rect(centerX3, centerY3, 20, 20);
            // Creates black square

            fill(255);
            ellipse(centerX3, centerY3, 15, 15);
            // Creates white circle
        }
    }

    for (var centerX3 = 25; centerX3 < width; centerX3 += 100) {
        for (var centerY3 = 75; centerY3 < height; centerY3 += 100) {
            // Creates pattern for lower left area
            fill(125);
            push();
            translate(centerX3, centerY3);
            rotate(radians(45));
            rectMode(CENTER);
            rect(0, 0, 30, 30);
            pop();
            // Creates rotated gray square

            fill(0);
            rectMode(CENTER);
            rect(centerX3, centerY3, 20, 20);
            // Creates black square

            fill(255);
            ellipse(centerX3, centerY3, 15, 15);
            // Creates white circle
        }
    }

    noLoop();
}

Sketch

Doing this was a bit tricky for me. I don’t have a very good taste in decoration. In addition, I am bad at coming up with patterns. However, in the end I think that I did alright. I thought it would be interesting to give the background a chess board formation, as I find it to be aesthetically appealing. The coding itself wasn’t very difficult. I only needed to set the coordinates as variables in the for loops, and the rest of the assignment practically did itself. I didn’t have much of a sketching phase, mainly because it just feels more natural for me to start coding right away.

enwandu-Project-05-Wallpaper

Wallpaper

// Emmanuel Nwandu
// enwandu@andrew.cmu.edu
// Section D
// Project-05-Wallpaper

cirY = 40; // Initial yposition of circle that start the columns
cirX = 40; // Initial xposition of circles that start the row
cSize = 80; // Diameter fo the circles
spacey = 20; // Controls vertical spacing betwen the circles
spacex = 20; // Controls horizontal spacing between the

function setup() {
    createCanvas(480, 480);
}

function draw() {
    background(0);

    // Draws a series of geometry in relation to each other
    // that fill the canvas
    for (var y = 0; y < height; y+=2.5){
        for(var x = 0; x < width; x+=2.5){
            var cy = cirY + y * spacey;
            var cx = cirX + x * spacex;
            noFill();
            // Controls stroke color based on position of circle
            stroke(cx, cy -100, cx + cy);
            strokeWeight(2);
            // Draws cirles that intersect with each other
            ellipse(cx - cSize/2, cy - cSize/2, cSize, cSize);
            rectMode(CENTER);
            noStroke();
            // Controls the color of the rectangle based on its position; matches the circles
            fill(cx, cy - 100, cx + cy);
            // Draws rectangle at the center of each circle
            rect(cx - cSize/2, cy - cSize/2, 15, 15);
            // Draws a small black dot at the center of each rectangle
            fill(0);
            ellipse(cx - cSize/2 ,cy-cSize/2 , 5, 5);
        }
    }

}

When I thought of wallpaper, my mind initially went to the ugly stuff you’d see on a grandparents wall in a movie or something. For this project, I was aiming for the opposite. My first pass at the code was essentially what I was trying to avoid; ugly wallpaper. Since I had initially had the intersecting circles as one color, i decided it would be interesting if they change depending on their position. After this I decided to accent the center of these circles, giving it a little more character.

sketch
// Emmanuel Nwandu
// enwandu@andrew.cmu.edu
// Section D
// Project-05-Wallpaper

cirY = 40; // Initial yposition of circle that start the columns
cirX = 40; // Initial xposition of circles that start the row
cSize = 80; // Diameter fo the circles
spacey = 20; // Controls vertical spacing betwen the circles
spacex = 20; // Controls horizontal spacing between the

function setup() {
    createCanvas(480, 480);
}

function draw() {
    background(0);

    // Draws a series of geometry in relation to each other
    // that fill the canvas
    for (var y = 0; y < height; y+=2.5){
        for(var x = 0; x < width; x+=2.5){
            var cy = cirY + y * spacey;
            var cx = cirX + x * spacex;
            noFill();
            // Controls stroke color based on position of circle
            stroke(cx, cy -100, cx + cy);
            strokeWeight(2);
            // Draws cirles that intersect with each other
            ellipse(cx - cSize/2, cy - cSize/2, cSize, cSize);
            rectMode(CENTER);
            noStroke();
            // Controls the color of the rectangle based on its position; matches the circles
            fill(cx, cy - 100, cx + cy);
            // Draws rectangle at the center of each circle
            rect(cx - cSize/2, cy - cSize/2, 15, 15);
            // Draws a small black dot at the center of each rectangle
            fill(0);
            ellipse(cx - cSize/2 ,cy-cSize/2 , 5, 5);
        }
    }

}

mjnewman Project-05, Section A

mjnewman-wallpaper

//Meredith Newman
//Section A
//mjnewman@andrew.cmu.edu
//Project-05 Wallpaper

function setup() {
    createCanvas(470, 470);
}

function draw() {
    background(100, 200, 205);
    for (var y = 0; y < height+50; y += 120) {
        for (var x = 0; x < width+50; x += 120) {

        	//Top Half-Head
        	noStroke();
            fill(290, 130, 200);//pink
            ellipse(x + 50, y + 50, 50, 50);
            //cover up for bottom half of circle
            fill(100, 200, 205);
            rect(x + 25, y + 50, 50, 25);

            //Tentacles
            stroke(290, 130, 200);
            strokeWeight(4);
            line(x + 30, y + 50, x + 35, y + 80);
            line(x + 42, y + 50, x + 48, y + 90);
            line(x + 54, y + 50, x + 57, y + 72);
            line(x + 66, y + 50, x + 71, y + 82);

            //Head Circle
            noStroke();
            fill(240, 80, 150);//slightly darker pink
            ellipse(x + 56, y + 33, 15, 8);//oblong circle

            //Bubbles
            fill(120, 220, 225)//slightly lighter blue
            ellipse(x + 90, y + 55, 10, 10);//medium bubble
            ellipse(x + 78, y + 20, 20, 20);//big top bubble
            ellipse(x + 20, y + 90, 8, 8);//small bottom left bubble
            ellipse(x + 33, y + 100, 5, 5);//tiny bubble
        }
    }
    noLoop(); 
}

I first had the idea to do a pattern of jellyfish. While, sketching actual jellyfish, I couldn’t stop thinking about Spongebob Squarepants and when he would go jelly fishing. So that definitely informed my color choice and somewhat of the graphic translation.

hqq – secE – project05 – wallpaper

hamza

//hamza qureshi
//hqq@andrew.cmu.edu
//section e
//project 5: wallpaper
function setup(){
    createCanvas(480, 480);
    background(190, 235, 254);
  }

function draw(){
    noStroke();


    lineitup(); //calls the functions for the three main
    plane1();   //components to the pattern
    plane2();
    noLoop(); //makes sure  nothing is redrawn
  }

function lineitup(){                        //lines running through background
    for (var y = 0; y < 480; y += 3){       //defines spacing between lines
      push();
      if (y%2 == 0){
        var d = .25;
      }
      else if (y%2 == 1){
        d = 0.75;                           //allows for the horizontal lines
      }                                    //to change based on whether the
      strokeWeight(0.5);                   //y-value is even or odd
      stroke(255);
      line(0, y, width, y);                //draws horizontal lines
      stroke(160,165,205);
      strokeWeight(d);
      line(y,0,y,height);                 //draws vertical lines
      pop();                              //used push/pop to change strokes
    }
}

function plane1(){
    for (var x = 0; x < 450; x+= 75){              //draws first set of planes
      for (var y = 0; y < 500; y+= 100){           //restricts it to 5 rows and 6 columns
        var r = random(170,255);                   //allows subtle color change between each
        var b = random(200,250);                   //paper plane
        var p = 30+x;
        var q = 15+y;
        fill(r, 180, b);
        triangle(p+15,q+45, p+30,q, p+55,q+5);
        triangle(p+15,q+45, p+20,q, p,q+10);
        fill(r-50, 150, b-50);
        triangle(p+15,q+45, p+20,q, p+28,q+5);
      }
    }
  }

function plane2(){                               //draws second set of planes
    for (var x = 0; x < 450; x += 75){           //restricts it to 6 columns and 4 rows
        for (var y = 0; y < 400; y+= 100){
          var r = random(160,220);               //subtle color  change
          var b = random(120,200);
          var u = 40 + x;
          var v = 60 + y;
          fill(r, 220, b);
          triangle(u,v+30, u+40,v, u-10,v+15);
          triangle(u+5,v+35, u+40,v, u+30,v+35)
          fill(r-50, 180, r-50);
          triangle(u,v+30, u+40,v, u,v+40);
          triangle(u,v+40, u+5,v+35, u+10,v+35);
          }
        }
}

For this assignment, I was inspired by the whimsicality of paper planes and how evocative their folds can be. I decided to take the opportunity to use lines to mimic a subtle fold in the background, while using tones to exemplify the shading in the folds. Next time, I’d love to figure out a way to turn this into a non-static graphic that flies with the mouse.

mstropka-Project-05-E

sketch

//Max Stropkay
//Section E
//mstropka@andrew.cmu.edu
//Project-05

var spacing = 120;
var x = 0; //initial x value
var y = 0; //initial y value


function setup() {
    createCanvas(480, 480);
    background(220);

    for(x = 0; x <= 5; x += 1){
      for(y = 0; y <= 5; y = y+1){
        var xpos = x * spacing;
        var ypos = y * spacing;
        if(y % 2 == 1){
          xpos -= 60;
          //defining each triangle that makes up the hexagon
          noStroke();
          fill(random(0,225));
          triangle(xpos+30,ypos, xpos, ypos+60, xpos +60, ypos+60);
          fill(random(0,225));
          triangle(xpos+30,ypos,xpos+60,ypos+60,xpos +90,ypos);
          fill(random(0,225));
          triangle(xpos+90,ypos,xpos+120,ypos+60,xpos+60,ypos+60);
          fill(random(0,225));
          triangle(xpos,ypos+60,xpos+30,ypos+120,xpos+60,ypos+60);
          fill(random(0,225));
          triangle(xpos+30,ypos+120,xpos+60,ypos+60,xpos+90,ypos+120);
          fill(random(0,225));
          triangle(xpos+60,ypos+60,xpos+90,ypos+120,xpos+120,ypos+60);
        }else{
          noStroke();
          fill(random(0,225));
          triangle(xpos+30,ypos, xpos, ypos+60, xpos +60, ypos+60);
          fill(random(0,225));
          triangle(xpos+30,ypos,xpos+60,ypos+60,xpos +90,ypos);
          fill(random(0,225));
          triangle(xpos+90,ypos,xpos+120,ypos+60,xpos+60,ypos+60);
          fill(random(0,225));
          triangle(xpos,ypos+60,xpos+30,ypos+120,xpos+60,ypos+60);
          fill(random(0,225));
          triangle(xpos+30,ypos+120,xpos+60,ypos+60,xpos+90,ypos+120);
          fill(random(0,225));
          triangle(xpos+60,ypos+60,xpos+90,ypos+120,xpos+120,ypos+60);
          //ellipse(xpos, ypos, 120, 120)


        }


      }
    }
}

For this project I used a hexagonal grid and drew each hexagon as triangles with a random black and white value assigned.

dnam-project-05-Wallpaper

sketch

/*
Doo Won Nam
Section B
dnam@andrew.cmu.edu
Project - 05
*/

function setup() {
    createCanvas(600, 600);
    background(142, 4, 2); //red background
}
function draw() {
  var rng = random()
  for (var y = 50; y < height -5; y += 100) { //small rectangles
      for (var x = 50; x < width - 5; x += 100) {
      //x and y increases depending on the line
      noStroke();
      fill(10, 46, 28); //dark green
      rect(x, y, 40, 40);
}
}
for (var y = 40; y < height -5; y += 150) { //big circles
    for (var x = 40; x < width - 5; x += 150) {
    noStroke();
    fill(9, 20, 1); // darker green
    rect(x, y, 70, 70);
}
}
//generate white randomly depending on the refresh
stroke("white");
var lineX = random(20, 400);
for (var lX = 0; lX < width; lX += lineX)
  line(lX, 0, lX, 600);
  noLoop(); // not constantly creating lines
}

Inspired from CMU’s tartan pattern, I wanted to make a background wallpaper that resembles the red, green, and white rectangles and line. I wanted to make the pattern lines refresh and have a new look everytime. The small rectangles change positions each line to make it more visually interesting.