# Bended lines : help

**URL:** <https://forum.kirupa.com/t/bended-lines-help/64115>\
**Category:** design\
**Created:** [September 13, 2004, 12:23pm UTC](https://forum.kirupa.com/t/bended-lines-help/64115 "2004-09-13T12:23:14Z")\
**Posts on this page:** 17\
**Page:** 1

<div class="post-metadata">

**Author:** ![pete\_zahut](https://avatars.discourse-cdn.com/v4/letter/p/91b2a8/32.png) [@pete\_zahut](https://forum.kirupa.com/u/pete_zahut)\
**Post date:** [September 13, 2004, 12:23pm UTC](https://forum.kirupa.com/t/bended-lines-help/64115/1 "2004-09-13T12:23:14Z")

</div>

Hi,

Is there anyone out there that can explain to me how you make “bended lines” ?

I mean like these :

:: [example 1](http://www.itworks.com.pt/main.php?lng=pt)

\> the background lines

:: [example 2](http://www.newezra.com/flash/)

\> below the menu, in the square box

Is there anyway to make these with Fireworks or Photoshop ?? Or does anyone have a tutorial on how to make these “bended lines”?

Thanks in advance

Pete Zahut

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [September 13, 2004, 1:05pm UTC](https://forum.kirupa.com/t/bended-lines-help/64115/2 "2004-09-13T13:05:07Z")

</div>

Most of the time I take a rounded rectangle or a plain circle on a seperate layer and move it and use load selection to remove/add parts on two connecting daigonal lines.  
(note it’s really hard to do it this way, someone else may have a better method)

Although it’s a million times easier in flash which I believe example 2 used.

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [September 13, 2004, 1:20pm UTC](https://forum.kirupa.com/t/bended-lines-help/64115/3 "2004-09-13T13:20:31Z")

</div>

either use illustrator or use paths in PS

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [September 13, 2004, 1:35pm UTC](https://forum.kirupa.com/t/bended-lines-help/64115/4 "2004-09-13T13:35:08Z")

</div>

Not sure how to do it in Flash, like Wanyo mentioned, but that’s how I do it in PS mlk.

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [September 13, 2004, 3:45pm UTC](https://forum.kirupa.com/t/bended-lines-help/64115/5 "2004-09-13T15:45:10Z")

</div>

> [@Servo2000](#):
>
> Not sure how to do it in Flash, like Wanyo mentioned, but that’s how I do it in PS mlk.

your probably gonna want to do it in illustrator to keep it nice and crisp…

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [September 13, 2004, 3:54pm UTC](https://forum.kirupa.com/t/bended-lines-help/64115/6 "2004-09-13T15:54:05Z")

</div>

Pen tool is your friend. In PhotoShop create a retangle box, do not raterize it. Then go in with your pen tool on certain parts of rectangle and modify the edges until you get what you want. I’m at college right now so I can’t give you an example. But maybe when I get home I cook up a tut for you. Although I know this isn’t the easiest way of doing this it will help I am sure.

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [September 13, 2004, 5:10pm UTC](https://forum.kirupa.com/t/bended-lines-help/64115/7 "2004-09-13T17:10:06Z")

</div>

yeh, a tut wud be cool, id like to know how to do it too 🙂

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [September 13, 2004, 5:19pm UTC](https://forum.kirupa.com/t/bended-lines-help/64115/8 "2004-09-13T17:19:27Z")

</div>

> [@Dj-Studios](#):
>
> Pen tool is your friend. In PhotoShop create a retangle box, do not raterize it. Then go in with your pen tool on certain parts of rectangle and modify the edges until you get what you want. I’m at college right now so I can’t give you an example. But maybe when I get home I cook up a tut for you. Although I know this isn’t the easiest way of doing this it will help I am sure.

You can use the pen tool to create them directly too; just create four points (at least) two will be needed for the smooth angle. Use the convert point tool to smooth the path (alt drag the handles so that only 1 side is smooth)  
remember that you can select several points and rotate; resize them etc (do not forget to move the rotation center around so that your angle stays smooth)…

to finish/make as sooth shape; you can select the current path your working with, alt click the whole path and drag it below (it duplicates it); then select the whole shape; and use ‘freeform pen’ tool to close ends…

hope this isn’t too confusing… i can provide more screenshots if you want

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [September 13, 2004, 5:29pm UTC](https://forum.kirupa.com/t/bended-lines-help/64115/9 "2004-09-13T17:29:31Z")

</div>

i know how to use the pen tool technically, i want to know if there is a short cut to setting up the perspective…

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [September 14, 2004, 12:15am UTC](https://forum.kirupa.com/t/bended-lines-help/64115/10 "2004-09-14T00:15:31Z")

</div>

here is my humble suggestion…  
using Illustrator, use the tool pen, turn off the fill first so you see where you are going. Turn on the grid, and use snap to grid options (under view–\>Show grid"  
The key is to allow the snap to grid function to work and simply using the curves as you see fit. look at the points I have used in the screen-grab.  
You can tweak the angles as sharp as you want and make adjustments on the fly if you mess up. I hope this helps

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [September 14, 2004, 4:02am UTC](https://forum.kirupa.com/t/bended-lines-help/64115/11 "2004-09-14T04:02:40Z")

</div>

The perspective things comes w/ just knowing art… it’s not really a technical thing. But if you’re wondering switch to the free transform tool (E) grab the corner you want to perspect hold cmd+ctrl+shift (mac) or alt+ctrl+shift and drag out it will perspect

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [September 14, 2004, 8:41am UTC](https://forum.kirupa.com/t/bended-lines-help/64115/12 "2004-09-14T08:41:22Z")

</div>

This is what i cooked this morning :hugegrin: :

![](http://home.tiscali.be/jeroencornelissen/gfx/try5.png)

Thanks for the tips all of you, I made this one with Fireworks using the pen tool.

What do you think of it?

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [September 14, 2004, 8:52am UTC](https://forum.kirupa.com/t/bended-lines-help/64115/13 "2004-09-14T08:52:56Z")

</div>

I like it, the yellow is very nice IMHO

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [September 14, 2004, 12:28pm UTC](https://forum.kirupa.com/t/bended-lines-help/64115/14 "2004-09-14T12:28:54Z")

</div>

can’t see it…

edit: ooh i can now… looks very good imho, remove the jcomm though… I love that bold then not bold text effect !  
looks extremely professional

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [September 14, 2004, 12:33pm UTC](https://forum.kirupa.com/t/bended-lines-help/64115/15 "2004-09-14T12:33:41Z")

</div>

> [@mlk](#):
>
> can’t see it…

here is the link : [click me](http://home.tiscali.be/jeroencornelissen/GFX/try5.png)

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [September 14, 2004, 9:57pm UTC](https://forum.kirupa.com/t/bended-lines-help/64115/16 "2004-09-14T21:57:30Z")

</div>

agree like the bold / unbold but the Jcomm just doesn’t sit well on the lines…

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [September 16, 2004, 6:32pm UTC](https://forum.kirupa.com/t/bended-lines-help/64115/17 "2004-09-16T18:32:32Z")

</div>

> [@d100763](#):
>
> agree like the bold / unbold but the Jcomm just doesn’t sit well on the lines…

yeah, i keeped staring at it and i just removed it and put in the right corner.

Thanx for the tips and info 👼
