75

AMA: I'm Manoela Ilic, Co-founder of Codrops

over 8 years ago from , Web Designer at Codrops

AMA: I'm Manoela Ilic, Co-founder of Codrops

Hi everybody,

you might know me better under my pseudo "Mary Lou", the girl who publishes web experiments, occasional tutorials and UI effect inspiration over at Codrops. I started Codrops back in 2009 with my partner Pedro Botelho after we decided to become freelancers. From a mere hobby, Codrops has grown into a full-time job. I'm very happy that I can do the things I love and delight web developers who enjoy our work at the same time.

I studied Cognitive Science in Germany, where I grew up, and then Computational Logic in Portugal, where I'm most of the time. After my studies, and before becoming a freelancer, I worked in a software company in Germany for a year.

When I'm not in front of the screen, you'll find me trying out some new raw vegan recipes or taking care of my little herb garden.

A big thanks to the LayerVault team for inviting me: it's an honor to be part of one of your AMA sessions!

And now it's your turn to ask me anything :)

Hit me

59 comments

  • James Young, over 8 years ago

    No question right now, just a massive thank you for posting some truly impressive demos and ideas!

    55 points
  • Vlad Magdalin, over 8 years ago

    Hi Manoela, I don't really have a question, but just wanted to say that you are a huge inspiration to me personally and to a lot of the folks here on the Webflow team. All your experiments are incredibly thorough and always give us new ideas to play around with. Thank you for all of your (and Pedro's) work!

    11 points
  • Matt AchariamMatt Achariam, over 8 years ago

    Hello Manoela, thank you for joining us today. Our community often finds a lot of inspiration and knowledge from the work you do at Codrops. I’d like to kick things off with a few questions.

    1. Having a background in cognitive science and computational logic why did you decide to write about design?
    2. Could you walk us through the creation of one of your articles? How do you find inspiration, what tools do you use, and what is the process like?
    3. Are there any tools you would like to see created for designers? Where do you see the greatest room for improvement in terms of working on the web?
    5 points
    • Manoela Ilic, over 8 years ago (edited over 8 years ago )

      Hi Matt, thanks again for letting me be part of this!

      1. I was always fascinated with the web and I built my first site when I was 16 (now I'm 33). When Pedro and I became freelancers we started Codrops for fun, just to share the things we learned at work. At our job I learned a lot of things about web and app design and after I left, I could finally turn my hobby into my profession. All I wanted to do is to learn more about design and web development. And that's how Codrops turned into our web playground.

      2. Inspiration for a demo/tutorial can come from many places, mostly from sites like Dribbble or Behance. Trying to make an effect better or trying out a new one leads to all kinds of ideas and that's usually how the story begins. After having a complete sketched out "storyboard" we decide on how the effect will be powered, what needs to be done in JS, which animations to use, etc. Then we start coding (I use Atom) and writing notes (for a tutorial). Finally we test in all browsers and then comes the challenging part of making everything work smoothly in all (modern) browsers. Besides a code editor we also use the dev tools of the browsers.

      3. I see a lot of potential in the dev tools (especially Chrome) and I'm keen to see its further development.

      3 points
  • Julian LloydJulian Lloyd, over 8 years ago

    Manoela! yay

    Your playground inspired scrollReveal.js, which was not only a critical piece of my portfolio, but the first thing I’ve created for (and given back to) the web community. It’s been an immensely rewarding and eye opening experience—so thanks! (Again.)

    A few questions…

    • Your work inspires tens of thousands of designers and developers. In an industry that is overwhelmingly male dominated—is it pressuring to be a role model for women in our industry to not only claim their place in it, but to lead and inspire others?

    • You’ve spent over 5 years building up Codrops, which is plenty long enough for someone to fall in love with a new idea. However now, you have earned a respecting audience and a strong platform to launch new products and services—do you have anything in mind for the next 5 years?

    4 points
    • Manoela Ilic, over 8 years ago (edited over 8 years ago )

      Hi Julian, thanks so much! scrollReveal is fantastic work and it's an honor to be part of the inspiration for it!

      • I don't really look at it that way because I've never really discriminated the skills of anybody or myself on the basis of gender or anything else that has nothing to do with the skill itself. Anybody can be an inspiration if they have something true and meaningful to share or say I guess.

      • Oh yes :) ...many new ideas! But you know, there's only one true love :D But we're planning and working on new things that might be interesting to our audience. We don't know how and when they will come into existence but we do know that building new things (as part of or apart from Codrops) is on the future menu :)

      Thanks again!!

      2 points
  • Mike BusbyMike Busby, over 8 years ago

    I'd like to thank you for the inspiration you've provided me over the years.

    I'm always very impressed with how you come up with variations on the experiments you most.

    I guess I would like to know your thought process

    3 points
    • Manoela Ilic, over 8 years ago

      Thank you for your kind words, Mike. Even for somebody who has studied brain sciences it's hard to explain my thought process. I think it helped me a lot to come from a very broad and different field. But having written HTML/CSS for almost 20 years is the most important aspect I guess. Thanks again :)

      2 points
  • Nathan LongNathan Long, over 8 years ago

    Do you and Pedro still freelance or have either of you switched to work on Codrops full-time? If it's split, how do you find time to do ANYTHING else?

    Can you talk a little bit about the journey of taking what started as a web playground and turning it into (presumably) a revenue stream? Was is difficult or was it a natural process?

    What's one thing (anything) you simply couldn't live without?

    2 points
    • Manoela Ilic, over 8 years ago (edited over 8 years ago )

      Hi Nathan, thanks for your questions! We still occasionally freelance and help out friends and family with dev/design work. But Codrops is definitely our full-time job :) And yeah, sometimes there's no time for anything else :) The journey was quite a natural process where we simply tried to make things better and better. I believe that if you do something good and more importantly, put your heart in it, then it will make some people happy. Having so many people liking our work gave us the fantastic opportunity to support ourselves and the blog with ads and we are incredibly grateful for that, every single day.

      That last question's answer: the nearness of the sea! :)

      Thanks again!

      5 points
  • Hendra SusantoHendra Susanto, over 8 years ago

    First of all, huge fans of Codrops.

    Just wondering, how long did it usually take you guys to create one experiment/tutorial?

    1 point
    • Manoela Ilic, over 8 years ago

      Hi Hendra, thank you and thanks a lot for your question! In average, I'd say it's about 3 full working days. It depends of course... sometimes it takes even a week and a couple of times it would just be a day. Thanks again!

      0 points
  • Tierney CyrenTierney Cyren, over 8 years ago

    Hey Manoela! Thanks for taking the time to do this on DN!

    I just took some time and read through all the comments you've answered to this point, and I noticed one theme among them all: people are passionate about the work you do. They really, really, really like it. Can you share any specific, focused elements of your work that you think helped get you to that point?

    1 point
  • Jessica PaoliJessica Paoli, over 8 years ago

    Hi Manoela! You and your work at Codrops have been an inspiration to me for years. On my zillionth visit, I realized all my favourite posts that showed ingenius experimentation were written by "Mary Lou" — a mysterious someone with woman's name who wasn't a traditional "household name" web design "celebrity", on the $1000-a-ticket conference speaking circuit, on the usual "web designers to follow" lists. That itself inspires me as much as the work you put in! Why the psuedonym Mary Lou? :)

    1 point
    • Manoela Ilic, over 8 years ago

      Hi Jessica, first of all, thank you!

      (this is from another reply I just wrote:) Mary Lou (or Marylou) is a character from Jack Kerouac’s "On the Road", a book I absolutely adore :) I used this pseudo for fun when we started Codrops and well, now I'm stuck with it :D

      At least it's easier to say than my real name, so I'm okay with that :)

      Thanks again!!

      1 point
  • Michael Cavalea, over 8 years ago (edited over 8 years ago )

    First and foremost: I'd like to thank you for your contributions in legitimizing front end development. Sites like CoDrops, and people like you, are changing the perception of frontend for the better, in an industry that has for the past few years been largely swept up in the advances in backend technologies (Rails, Node, etc).

    Just one question for ya, if you wouldn't mind! I'm really curious about your process - what you're doing everyday that supports your output of nothing but the best articles/tutorials.

    What websites/accounts are you checking multiple times a day, every day, religiously? Be it news sites (like this one), Twitter accounts, etc.

    1 point
  • Nate vNate v, over 8 years ago (edited over 8 years ago )

    How much is my head gonna explode when I see the new Tympanus site?

    1 point
  • Andrew CiobanasiuAndrew Ciobanasiu, over 8 years ago (edited over 8 years ago )

    Hello Manoela!

    No questions, just re-iterating the thanks others have expressed. I'm on codrops almost every day checking out your ideas and demos. Definitely a favorite.

    Thanks to you and the others!

    1 point
  • Chip Dong Lim, over 8 years ago

    I just want to say thank you so much, Manoela! Codrops opens up a new possibility for me as a young designer and allows me to tweak and play things around. Thanks for making the web a far more interesting playground for me!

    Warmest regards, Chip

    0 points
  • Sagi ShrieberSagi Shrieber, over 8 years ago

    Hey Manoela, no question, but wanted to thank you for the amazing and inspiring work you are doing :) Keep up the amazing work!

    0 points
  • ekan shkothekan shkoth, over 8 years ago (edited over 8 years ago )

    Heya Manoela, ma’am you have some really amazing designs and i have been following your work on codrops (by following i mean in a total admirer, non-stalking way -) n i really really like your work with your effects on headers and menus and backgrounds…

    I am doing some work on html5 and css3 and beginning on js and would really appreciate some tips or like pointers you would have for an aspiring front-end designer…

    And thankyou for sharing such cool work

    0 points
  • saptarshi nathsaptarshi nath, over 8 years ago

    Hi, What advice do u have for young international students who might not have enough exposure or resources to excel in the industry?

    0 points
    • Manoela Ilic, over 8 years ago

      Hi Saptarshi, thank you for your question! I'm really no expert in this topic but I think that when your work is solid, people will notice you (if you have any kind of public profile of course). So the best thing to always do and continue doing is to learn more and more and produce meaningful things along the way. Getting inspired by great designers or programmers is also important. Dissecting the work of others can teach you a lot of things. Hope this makes sense and thanks again!

      1 point
  • Smail SmajkicSmail Smajkic, over 8 years ago

    Thanks dude! Best Site for Inspiration. Impressive demos and ideas. There is no better site.

    0 points
  • Spencer Bigum, over 8 years ago (edited over 8 years ago )

    Hello Manoela, thank you for taking the time here to answer questions - so cool! I know for sure that everyone I work with and teach at a design school here in Atlanta, GA uses your site as a great source for inspiration - so thank you so much for your work.

    My question: I'm a designer working to up my game as a front-end dev. For the past 6 mo I've been pretty hardcore on css/html + jquery/js. If you were to schedule the ideal year of learning/languages for someone like me, what would you recommend? I'm not sure what the path should look like to move beyond the fundamentals to functional coding.

    0 points
    • Manoela Ilic, over 8 years ago

      Hi Spencer, thanks so much for your questions and your kind words!

      I'm not quite sure if I understand your question correctly, I apologize... do you mean what the best year in terms of a lifespan is to learn programming languages?

      If you are already into all the front-end setting then I'd believe that the next step is to start creating things that are more complex. I always found that when getting the hands dirty was the time I learned more. Sometimes it would get ugly and I'd do a lot of mistakes, but they are worth more than any book on the topic. I've met many people who spend years and years reading things and following how-tos but they never end up having fun in doing something because they are too scared that their foundations are not strong enough. Having a solid basis is a must of course, but I also think that solving problems even with beginner skills will help reach the next level of understanding. Hope this makes sense :) Thanks again!

      1 point
  • Braden HammBraden Hamm, over 8 years ago

    It's amazing how Codrops helped me learn early on, and how I continue to learn from it now. It's great for all experience levels!

    How did you come up with the names Tympanus and Codrops? Is there a special meaning to them?

    0 points
    • Manoela Ilic, over 8 years ago

      Hi Braden, thanks a lot, I'm really glad our work has helped you learn!

      Before we even finished university, we always wanted to do some kind of web-related project and one of ideas that we had was a site for musicians where they could get together and find fitting band members or collaborators. The name Tympanus come from "tympanic membrane", the eardrum, which we thought was a fitting name. We ended up buying the domain back in 2006 but we never managed to go on with the project. Later we used it as our agency site and started Codrops as the agency blog. Codrops is supposed to be a shortage for Code Drops (that's why our tagline used to be "useful drops of code"). Our aim was to share useful code snippets and so we thought that this name was interesting and unique.

      Thanks again!

      1 point
  • Can GoktasCan Goktas, over 8 years ago (edited over 8 years ago )

    First of all, thank you for existing :) Codrops helped me making my customers happier. You always had the points that make people smile while experiencing it.

    My question is, what do you think about CodyHouse? They seem like you a bit.

    0 points
    • Manoela Ilic, over 8 years ago

      Hi Can, thanks a lot! That's nice of you to say :) The first time I saw the work on CodyHouse I knew right away that this is the result of somebody putting a lot of thought and love into what they were doing. Claudia and Sebastiano seem like really lovely people who share the same passion like us and their qualitative work delights me :) Thanks again!!

      0 points
  • Meag TessMeag Tess, over 8 years ago

    Hi Manoela!

    • How do your degrees in cognitive science and computational logic influence your work on a daily basis?
    • Could you provide any insight into the benefits and drawbacks of going that route vs a HCI or UX or CS route for undergrad/graduate school?
    • Do you have any favorite authors and designers?
    • Why do you call yourself Mary Lou?

    btw, absolutely love the work you do! Your ideas and implementations always prove to be fresh and invigorating. Thank you!

    0 points
    • Manoela Ilic, over 8 years ago

      Hi Meag, thanks a lot for your questions!

      Regarding the first one (see also the reply to Carolyn's question): Having studied cognitive science gave me some notion about how we perceive things and that's great for designing interactions. Computational logic and logic programming "inverts" your programming thinking in such a radical way that you start thinking about solutions differently, I guess. So that's where I see the daily influence.

      I really have not much of an idea about HCI or UX as courses so I can't compare that. I've had some CS in my studies which helped me a lot for programming. But I'm really not sure what's better. I know some people who studied interface design and combined with front-end development or programming skills they just kill it. Those are the great minds that turn data into something we humans can understand and interact with, I really admire their work.

      I have many favorite authors and designers, listing them all here would be insane and I wouldn't want to let out anybody, so I'm not daring to start a list :)

      Mary Lou (or Marylou) is a character from Jack Kerouac’s "On the Road", a book I absolutely adore :) I used this pseudo for fun when we started Codrops and well, now I'm stuck with it :D

      Thanks again, Meag!!

      2 points
      • Meag TessMeag Tess, over 8 years ago

        Thanks for the response! I never knew computational logic even existed, and am definitely looking further into it. If a follow-ups allowed, I'm curious :

        • I see you use Atom and browser dev tools - are you writing all the js and css by hand? • Do you ever have a need for tools like yeoman, grunt, npm, etc? • Any preference between less/sass and/or frameworks like bootstrap or compass? Have you guys created your own?

        0 points
  • Jeff Lindsey, over 8 years ago (edited over 8 years ago )

    Hi Manoela,

    First, I love your website! So many of my own inspirations have come from your articles and tutorials.

    One question... when will tympanus.net's makeover be finished?

    Thanks again,

    Jeff

    0 points
    • Manoela Ilic, over 8 years ago

      Thanks a lot, Jeff!

      That's definitely a plan for the near future... once we've figured out what it's supposed be :) When we were freelancers it used to be our "agency" website where we'd have info about the services we offer. Since Codrops has become a full-time job, the main page lost its purpose :) It's almost turning into an internal joke with a deeper meaning... the endless makeover... :) Thanks again

      1 point
      • Jeff Lindsey, over 8 years ago

        I completely understand! My own portfolio website has been needing a makeover for quite some time now, but ain't nobody got time for that!

        0 points
  • Ivan DrinchevIvan Drinchev, over 8 years ago

    Hello Manoela,

    I'm huge fan of your (codrops) works. You are unique and very, very valuable for me and other developers ( I'm sure ).

    Anyway I have only one question :

    Is codrops profitable ( in terms of money ) as a project and ( oops second question ) is it enough for you to do only this and no other work to live your life? :)

    Thanks, you guys / gals ROCK!

    0 points
    • Manoela Ilic, over 8 years ago

      Hi Ivan, thanks a lot! For us it's profitable and enough to live our lives, yes. What is priceless though is the freedom it gives us to work from anywhere. For people like us who love to travel it's a best thing in the world :) Thanks again!!

      5 points
  • Pierre VerrierPierre Verrier, over 8 years ago

    Manoela,

    Yourself and Pedro have created some truly amazing tutorials & examples since Codrops began. It is a vast playground that helps advance workflow and allows people to push the boundaries.

    No questions from me, just wanted to say keep up the good work. We all enjoy and very much appreciate the sharing of your combined passions. As long as Codrops continues, as will my bookmark.

    Cheers!

    0 points
  • Carolyn YooCarolyn Yoo, over 8 years ago

    Hi Manoela,

    Much love! I absolutely love your website and all its demos and tutorials. Thank you for the inspiration and your contribution the community.

    One question: How do you find your cognitive science background affects your design? I also studied cognitive science as an undergrad and am curious to see how it serves as a foundation for your work.

    0 points
    • Manoela Ilic, over 8 years ago

      Hi Carolyn, thanks so much!

      I found that studying CogSci made me a Jack of all trades in many things. The overall holistic apporach of getting a grasp of so many different scientific areas creates a great foundation for having a greater vision for many things. Everything is interconnected and for something to work, we need to make all the parts work and interact with each other in harmony. Having a clue how the human brain processes things makes it easier to create meaningfull interactions with machines. It's an underrated understanding when it comes to designing websites. Cognitive Science definitely "trains" you to keep the big picture in mind, I think. Hope this makes sense :) Thanks again

      3 points
  • Stephen BoakStephen Boak, over 8 years ago

    Manoela, have you thought about something bigger for Codrops? I feel strongly that design communities lag behind their engineering counterparts due to a lack of openness and sharing. What I love most about Codrops is that it exposes something greater than the how-to of design (though it does this amazingly well), which is the exploration: the alternative design scenarios in your tutorials speak to a deeper thoughtfulness that I think can really help move the design community forward. If Codrops becomes a place to "converse" about the alternative solutions we've found to the problems posed in your blog, I would love to express not only the "how", but the "why" of these solutions.

    0 points
    • Manoela Ilic, over 8 years ago

      Hi Stephen, most definitely! I get what you are envisioning. It would be great to do something that involves more conversation and collaboration of everybody where solutions could be found more effectively and where boundaries can be pushed to discover new possibilities. We have some plans in that direction and we'll hopefully be able to push it forward. Thanks for your question

      1 point
  • Daniel GoldenDaniel Golden, over 8 years ago (edited over 8 years ago )

    Hey, some of your stuff is uber intriguing and inspiring. A few questions for you:

    • Where do you get ideas for some of the experiments you post?
    • Are you currently a student in some capacity?
    • Even if not a student, what tools do you use to continue to learn beyond University?
    • Also, how old are you?
    0 points
    • Manoela Ilic, over 8 years ago

      Hi Daniel, inspiration comes from many places, especially from Dribbble or Behance. Having to solve a problem or wanting to make something better usually sparks a lot of ideas.

      Of course I'm a student! ;) I'm not enrolled in university but as a web dev/designer you learn every day. All resources on the web about front-end development are great teachers. I'm 33.

      Thanks!!

      3 points
  • Matt SoriaMatt Soria, over 8 years ago

    Manoela, thanks for doing this!

    Each of the demos on Codrops is so extremely thorough and elaborate, with usually not just one example, but upwards of 20 or 30 examples sometimes! When you or one of the people that writes for Codrops takes on an article is the development, testing, and implementation of the actual demo a collaborative effort, or is the author of the post the sole contributor to the demo and everything?

    Thanks!

    0 points
    • Manoela Ilic, over 8 years ago

      Hi Matt, thanks for your question! Pedro and I always work together on the demos and making a joint effort results in greater productivity where we spur each other on and produce more effects and styles. Having somebody thinking on while you are coding is really great and that's how we can come up with many examples. We also help our guest writers with testing and styling, too. But that's just the final touches to their work.

      2 points
      • Matt SoriaMatt Soria, over 8 years ago

        Awesome! Yeah, that's what I was most curious about — when you have guest writers. I always thought that being invited (or do they approach you?) to do an article would be extremely daunting because of the amount of detail and examples and styling that go into the demos, but it's good, and I guess not so surprising, to hear that you and Pedro always work alongside them and help out with testing, etc.

        Thanks for the answer!

        By the way, I'm a Front-end Developer at a design studio, and the designers here are constantly using Codrops for inspiration and ideas on interaction and stuff, which is a thrill for me because it get's them off of non-interactive design formats like Illustrator and InDesign and thinking more about how design elements work within the web and with user interaction.

        0 points
        • Manoela Ilic, over 8 years ago

          We sometimes approach people and some also approach us :) But the process for writing or doing something for Codrops can be quite challenging for the writer and for us because of the standards that we set.

          It's really awesome that we create things that are inspiration to so many, it's what motivates us. And to hear that it makes them become more "interactive" that's really cool.

          Thanks a lot again!

          1 point