roslinpl (OP)
Legendary
Offline
Activity: 2212
Merit: 1199
|
|
January 06, 2017, 02:53:04 AM |
|
I want to master this. Since signatures are in demand here. I will be good sideline to make some extra income. Thank you for tutorials roslinpl and more tutorials to come. Its a bit hard because im not good at codes. But still im willing to do this anyway.
Hello, Step by step my friend. I'm sure you can be the BBCode master. Try to follow my lessons and try to recreate images from lesson's exercises. Try to experiment with it. All you need is patience and time. Best wishes.
|
|
|
|
roslinpl (OP)
Legendary
Offline
Activity: 2212
Merit: 1199
|
|
January 07, 2017, 03:13:45 PM Last edit: March 18, 2018, 10:20:56 PM by roslinpl |
|
Lesson 8: BBCode Drawing Basics lvl.IIIWe alreadu know the most important things about BBCode signatures. It's time to create a simple signature for Serior/Hero/Legendary Members. Let say that we want to create a signature which will looks like: ░░░░░░░▄▄▄▄▄▄ ░░░░▄██████████▄ ░░░██████████████ ░░██████░▐▌░██████ ░█████░░░░░░░▀█████ ██████▄▄░░▄▄░░██████ ████████░░▀▀░▄██████ ████████░░▄▄▄░░█████ ██████▀▀░░▀▀▀░░█████ ░█████░░░░░░░░█████ ░░██████░▐▌░██████ ░░░██████████████ ░░░░▀██████████▀ ░░░░░░░▀▀▀▀▀▀ ░░░▀▀▀████████▀▀▀
| We ♥ Bitcoin
|
I won't write a step by step tutorial but instead of that I uploaded a video for you where I captured a process of creation. I doubled the clip speed, in reality it took me 18.5min. Video length is 9min12sec. Lesson 8 video tutorial: https://youtu.be/McKHrx1tBK0When we want to replicate an image/logo with BBCode it's good to prepare and upload an image file so we can check our results on the run with an original image. Lesson 8 Bitcoin logo image: https://i.imgur.com/gPmC4Xi.pngIt's simplified Bitcoin logo - I adjusted pitch angle to make it looks better in BBCode. 2pt ASCII chars are not perfect for BBCode drawings but at least 2pt is most compatible as we already know from the lesson 4. With the current versions of Chrome/Mozilla/Safari browsers I suggest using 2px Monospace font when drawing with BBCode. As mentioned in lesson 10. Lesson 8 BBCode signature code:[center][table] [tr] [td] [size=2pt][color=#f90][color=transparent]░░░░░░░[/color]▄▄▄▄▄▄ [color=transparent]░░░░[/color]▄██████████▄ [color=transparent]░░░[/color]██████████████ [color=transparent]░░[/color]██████[color=transparent]░[/color]▐▌[color=transparent]░[/color]██████ [color=transparent]░[/color]█████[color=transparent]░░░░░░░[/color]▀█████ ██████▄▄[color=transparent]░░[/color]▄▄[color=transparent]░░[/color]██████ ████████[color=transparent]░░[/color]▀▀[color=transparent]░[/color]▄██████ ████████[color=transparent]░░[/color]▄▄▄[color=transparent]░░[/color]█████ ██████▀▀[color=transparent]░░[/color]▀▀▀[color=transparent]░░[/color]█████ [color=transparent]░[/color]█████[color=transparent]░░░░░░░░[/color]█████ [color=transparent]░░[/color]██████[color=transparent]░[/color]▐▌[color=transparent]░[/color]██████ [color=transparent]░░░[/color]██████████████ [color=transparent]░░░░[/color]▀██████████▀ [color=transparent]░░░░░░░[/color]▀▀▀▀▀▀ [color=transparent]░░░[/color][color=#e1e1e1]▀[color=#d3d3d2]▀[color=#c6c4c3]▀[color=#b8b6b4]█[color=#aaa8a5]█[color=#9c9a96]█[color=#8f8b87]█[color=#817d78]█[color=#918e8a]█[color=#a19e9b]█[color=#b1afad]█[color=#c1c0be]▀[color=#d1d0d0]▀[color=#e1e1e1]▀ [/td] [td] [size=25pt][b][i][color=#f90]We [color=red]♥[/color] Bitcoin[/b][/size] [/td] [/tr] [/table][/center]
|
|
|
|
LoyceV
Legendary
Offline
Activity: 3444
Merit: 17442
Thick-Skinned Gang Leader and Golden Feather 2021
|
|
January 07, 2017, 03:25:56 PM |
|
My Firefox 50.1.0 (running on Linux Mint) has a problem displaying several signatures. A screenshot from the OP: On the left: Chromium. On the right: Firefox. It's been like this for as long as I can remember. My own signature doesn't show correctly either. Adjusting zoom-settings doesn't matter. I prefer using Firefox though. Am I the only one with this problem?
|
|
|
|
roslinpl (OP)
Legendary
Offline
Activity: 2212
Merit: 1199
|
|
January 07, 2017, 03:34:12 PM |
|
My Firefox 50.1.0 (running on Linux Mint) has a problem displaying several signatures.
(...)
It's been like this for as long as I can remember. My own signature doesn't show correctly either. Adjusting zoom-settings doesn't matter. I prefer using Firefox though. Am I the only one with this problem?
Hey, You're not the only one. This is the main problem with BBCode designs. Different OS, different browser might cause a BBCode design will glitch. There is no possibility to create a design which will be 100% compatible with all OS and browsers. Read lesson 4 for more info. Best regards.
|
|
|
|
poptok1
|
|
January 07, 2017, 04:01:44 PM |
|
My Firefox 50.1.0 (running on Linux Mint) has a problem displaying several signatures. -snip-
It is also a matter of default fonts. Fonts processors in Linux systems are known to be chimeric (if there is such a word) Try to install some third party "clear font/win. alike" font renderer, it may help. I have had this problem with my puppy OS, manual setting up default fonts for firefox helped a bit but on the other hand, other sites where displayed incorrectly. Its a hassle @roslinpl 2bad you didn't make this thread self-moderated... Peoples (valuable) opinions disrupt the reading (including mine) THX 4 sharing this roslin, knowledge is commodity, 1 knowledge = 1BTC and there are markets for it
|
|
|
|
darklus123
|
|
January 17, 2017, 06:25:39 PM |
|
II really wanted to learn BBcodes to have a side line in this forum, Thank you so much i hope that you could update the tutorials above and if you can create some video tutorials that would be great. Just want to ask something were can we possibly test those codes? Especially if we do not have hero/sr ranks accounts for testing
cheers,
Hey, in my opinion the best environment for testing is Google Chrome web browser and a 'post preview' and if we do everything right the signature should work just fine. 1) When you're working on a signature put your signature code inside 'quote' tags. 'Quoted text box' has similar style as 'signature space'. 2) Remember about signatures styling rules. 3) If everything looks good you can remove 'quote' tags and copy your signature code into your profile settings. Thank you so much, I have been working on this slowly haha atleast I am learning. Good job to you do i haven't tested it yet but i will as soon as i am ready for my first signature design regards, Edit: i just tested it on the lesson 3 and i think that it just work fine
|
|
|
|
youdacapt
|
|
January 17, 2017, 07:53:11 PM |
|
I think there was some kind of premium tool to generating code automatically without manual work. But I didn't find it.
By the way. Is it possible to make a BBcodes could move like Gif format?
|
|
|
|
Vikingr
|
|
January 17, 2017, 09:20:09 PM |
|
I think there was some kind of premium tool to generating code automatically without manual work. But I didn't find it.
By the way. Is it possible to make a BBcodes could move like Gif format?
I have searched for it on google but not found any tool to generate the code directly for the signature of bitcointalk. and it is not possible to make animated things in bbcode signatures
|
|
|
|
banjir
Newbie
Offline
Activity: 44
Merit: 0
|
|
January 17, 2017, 09:25:06 PM |
|
omg finally i found this thread about how to creat some signature BBcode. thankyou very much for tutoriasl i was bookmark your link now and ready for learn everyday '' wish me luck ''
|
|
|
|
veleten
Legendary
Offline
Activity: 2016
Merit: 1106
|
|
January 22, 2017, 04:28:25 PM |
|
My Firefox 50.1.0 (running on Linux Mint) has a problem displaying several signatures.
(...)
It's been like this for as long as I can remember. My own signature doesn't show correctly either. Adjusting zoom-settings doesn't matter. I prefer using Firefox though. Am I the only one with this problem?
Hey, You're not the only one. This is the main problem with BBCode designs. Different OS, different browser might cause a BBCode design will glitch. There is no possibility to create a design which will be 100% compatible with all OS and browsers. Read lesson 4 for more info. Best regards. there is a tool to test compatibility with over 1000+ desktop browsers and any combination of 0S, device and browser it is not cheap if you buy a subscription,BUT there is a free trial that one can use to make sure your code looks ok https://www.browserstack.com/
|
|
|
|
roslinpl (OP)
Legendary
Offline
Activity: 2212
Merit: 1199
|
|
January 23, 2017, 12:20:48 PM |
|
My Firefox 50.1.0 (running on Linux Mint) has a problem displaying several signatures.
(...)
It's been like this for as long as I can remember. My own signature doesn't show correctly either. Adjusting zoom-settings doesn't matter. I prefer using Firefox though. Am I the only one with this problem?
Hey, You're not the only one. This is the main problem with BBCode designs. Different OS, different browser might cause a BBCode design will glitch. There is no possibility to create a design which will be 100% compatible with all OS and browsers. Read lesson 4 for more info. Best regards. there is a tool to test compatibility with over 1000+ desktop browsers and any combination of 0S, device and browser it is not cheap if you buy a subscription,BUT there is a free trial that one can use to make sure your code looks ok https://www.browserstack.com/Hey, thanks a lot for sharing it with us. Seems like a cool tool! Thanks everyone for your participation in the lessons. I'm glad that someone find them useful More lessons coming soon Stay tuned. Best wishes.
|
|
|
|
apoorvlathey
|
|
January 23, 2017, 01:03:54 PM |
|
Nice tutorials rosinpl ! Keep them coming I also made a video displaying how to make pixel art using photoshop ! With this trick it is easier to make complex designs faster and it is better than pixel by pixel imo. Hope you like it ! Check is out here :
|
|
|
|
Joel_Jantsen
Legendary
Offline
Activity: 1988
Merit: 1317
Get your game girl
|
|
January 23, 2017, 05:48:46 PM |
|
Nice tutorials rosinpl ! Keep them coming I also made a video displaying how to make pixel art using photoshop ! With this trick it is easier to make complex designs faster and it is better than pixel by pixel imo. Awesome.Never knew that,it simplifies process so much! I have been a idiot all my life wasting hours aligning the pixels and still couldn't get a perfect picture.I should start looking out for signature design contests now.
|
|
|
|
Diced90
|
|
February 11, 2017, 10:29:10 AM |
|
Hope you like it !
I like it and thanks for the share, though it seems people have not yet got into signature making looking at the number of views and likes Waiting for lesson 5 now sensei Rosinpl
|
|
|
|
cluit
Legendary
Offline
Activity: 1176
Merit: 1016
|
|
February 11, 2017, 02:08:34 PM |
|
I would like to appreciate roslinple and all other who sharing experience and tutorials, I will read and watch all tutorials and try to participate in signature designing contests too.
Thank You so much.
|
|
|
|
V1saya
|
|
February 11, 2017, 04:10:37 PM |
|
Cool. This is very helpful. I studied some basic coding more than a decade ago but i'll try to read this when needed. I leave a message so I can easily track this. Thanks for the share. Much appreciated.
|
|
|
|
ice18
|
|
February 15, 2017, 04:56:57 AM |
|
Thank you for this thread, very useful tutorials maybe I can use it for future reference.
|
|
|
|
roslinpl (OP)
Legendary
Offline
Activity: 2212
Merit: 1199
|
|
February 15, 2017, 11:45:17 PM Last edit: February 16, 2017, 09:05:53 PM by roslinpl |
|
Nice tutorials rosinpl ! Keep them coming I also made a video displaying how to make pixel art using photoshop ! With this trick it is easier to make complex designs faster and it is better than pixel by pixel imo. Hope you like it ! Check is out here : Hello, Thanks for sharing! It's pretty impressive! The only thing I would mind about is using 'white-space' inside of a BBCode pixel image design placed in a table rows( [ td ] ). Because when you put 'white-space' at front of a row the space might be invisible. For example: ONE_WHITE_SPACE_BEFORE_THIS_LINE TWO_WHITE_SPACES_BEFORE_THIS_LINE
|
Example code:[quote] [table] [tr] [td] ONE_WHITE_SPACE_BEFORE_THIS_LINE TWO_WHITE_SPACES_BEFORE_THIS_LINE [/td] [/tr] [/table][/quote] When you're working on a design it's important to know about it. I'm using transparent characters instead of white-spaces because of that. It waste more characters but it's more accurate technique IMO while drawing with BBcode. But no matter what, you have good skills and I would just suggest to think about replacing 'white-spaces' with transparent characters. Thanks again for your tutorial video. It's very interesting when we combine knowledge. Hope you like it !
I like it and thanks for the share, though it seems people have not yet got into signature making looking at the number of views and likes Waiting for lesson 5 now sensei Rosinpl Actually you can find 8 lessons here Lesson 9 coming soon. A short one but useful Thanks everyone for kind words! Lesson 9 coming up (Edited: done ). Best wishes.
|
|
|
|
stardustin
Jr. Member
Offline
Activity: 56
Merit: 1
|
|
February 16, 2017, 10:54:40 AM |
|
Thank you very much man, this was a great tutorial, I am new here but from the begining I was interested about how to create bbcode signature. Don't forget that there are some people, which will like your work.
|
|
|
|
zzTAz
Newbie
Offline
Activity: 36
Merit: 0
|
|
February 16, 2017, 11:36:27 AM |
|
thank you for this awesome work
|
|
|
|
|