Bootyard

Last November 22 - 23, 2012 the biggest IT event in the Philippines comes to Cebu. The Philippine Youth Congress on Information Technology or commonly called as Y4iT (Youth for IT) is an annual event hosted by UP Information Technology Development Center (UPITDC) that provides a venue to experience activities and hear talks about IT and IT-related topics from various speakers in the different fields in IT to hone the global competence of IT practitioners.

Together with CeBuinIT, they organized the very first Y4iT outside Luzon. 

Around 3,000 IT students from different schools in Visayas and Mindanao from Leyte, Iloilo, Surigao, Aklan and more came here to Cebu to experience Y4iT. It was great to see the enthusiastic faces and high energy of the participants.     

It was also a privilege for us to be invited to speak about our startup experience. 

  Ademar ended his talk with this line, "Love what you do".

It was a great experience for everyone. We learned a lot from the speakers and inspired us to work harder. I hope the students also learned something. 

Know more about the speakers here. More photos here.

As what Mr. Jerry Rapes, President and CEO of Exist, shared to all of us, "You only need 3 things to succeed in IT: a computer, internet connection and the thing between your ears". 

Google Developer Groups (GDG) Cebu had its very first GDG DevFest in Cebu last November 7, 2012 at Quest Hotel. A lot of participants from the academe, industry, startups who are eager to know more about Google Technologies joined the event. We're happy that we were invited by Mr. Jerome Locson to be part of the panel for Let's Startup. Thanks Jerome!

Ms. Pauline Wade of CeBuinIT, Mr. Dave Overton representing Techtalks.ph for SWCebu and us (Photo taken from GDG Cebu)

Google and Education by Ms. Janet Yoon

HTML5/CSS3 by JM Ibanez

Mobile UI Designing: Android UI/UX Best Practices by Mac Ailjun Madrid

Students from USJR with their professor

It was a great opportunity for everyone, especially for the students. The event ticket was free and you get to be updated on the current technology trends. If you truly want to take charge of your career route, we suggest that you join tech events in your local community. You'll learn a lot and you get to meet a lot of people giving you more options on what career path to take. :)

Links:

Website: http://www.gdgcebu.org/

Google+: http://www.gplus.to/gdgcebu

More photos here.

I’ve always pictured “Ruby” to that gem - that shining red gemstone, adorning women of high class; surely an eye catcher, precious, expensive, not for a commoner. But just recently, this seemingly luxurious item is not solely the picture. Similar to this fancy object, I am now learning a new object-oriented programming language by the name of Ruby.

But before learning Ruby was setting up Ubuntu. It was not my first time but still the installation was not smooth flowing. I had to repeat a couple of times, read tutorials of dual-booting over and over again before alas! Welcome to Ubuntu! Even using it was not that piece of cake.

Just like a whole new experience, adjustments are present. I’m back to studying. I’m back to reading and like a student from my university days; I’ll be learning a new programming language. It is not that new to me though. Being used to Java language, it becomes easier for me to understand since it’s also an object-oriented language. However, unlike Java, everything in Ruby is treated as an object. And when I say everything that includes an integer or even a string – that’s really something new for me.

Provided with an interactive way of learning, I started learning Ruby from rubymonk.com. In here, I’ve tried to write my own line of code to accomplish simple tasks in Ruby – working with Strings, Arrays and more. The site just does not feed you with the code to write but importantly makes you think, analyze or sometimes guess (which I usually do ^^) how you do the task the Ruby way.

Right now, I’m still confused with certain things. I was expecting to be able to make my own simple program but I don’t know where to start. I actually have a lot of questions that I know not how to deliver; I mean how to ask about these things. Since I’m not yet done with learning Ruby, I looking forward to learn more, expecting that as I continue all of these questions would be eventually answered. On top of that, I set myself to be able to write a complete working code in Ruby – my very first.

One way to improve our startup community is to share the learnings. We're happy because we're given a chance to share our learnings from Hack2Hatch to a group of startups headed by Markjeee, Dave and Tins.

Ademar shared what Codetoki learned from h2H.

The best way to present the learnings is to dress the experience.

That's the explanation why Hawaiian was the perfect outfit. hehe. So, here's what we shared:

Hack2hatch Learnings Summary

The main point we highlighted was how important the business plan is. We're not referring to the traditional business plan. What we're talking about is that you have to be prepared on defending the viability of your proposed solution through research and figures.

From our experience in h2H, we learned that being prepared on the business aspect really matters. Here's a list on what we think we should have prepared:

Elevator Pitch - A short summary about your product and its value proposition.

Market Validation - Determine the market size and target market. Can also include your research / survey on what your target customers think about your product. 

Problem - A clear explanation on what you are trying to solve since you are proposing for a solution to a problem, not a solution looking for a problem. 

Solution - Explanation on what your product is all about and how it will help solve the problem. 

Revenue Model - What is your price structure. How would you price your service offering.

Financial Projections - Revenue forecast for 3 to 5 years. (Don't get intimidated with figures. You may check your market size and from there, forecast how many would use your product.)

Market Opportunity - An identified need, want, trend or demand that opens an opportunity for you to grab and exploit. 

Differentiation - What makes your product/service stand out among your competitors. Explanation on the unique value you give to your customers. 

(Disclaimer: These were based from the things we understood. Feel free to correct us if we're wrong. Also, feel free to share what you learned too so more people can benefit from this discussion. Thank you!) 

Here's a group photo of BSFounders Club. Thanks Markjeee for the treat! :)

Master List

Markjeee of Caresharing

Dave of Sym.ph

Tins of Techtalks.ph

Wes of Mynimo.com

Mark and Johanna of Happy Garaje

Jerome and Daryl of Luto.co

Albert and Nicole of Spelldial

Janessa of WaitKnowMore

Ian and Patrick of Schoolabs, Tropa.ph

Me and Ademar of Codetoki

more photos here

(P.S. Markjeee is also calling out startup founders out there. If you're interested to be part of the tech circle in Cebu, feel free to email me at honee[at]bootyard.com so I can introduce you to the group.)

So Hack2Hatch is finally happening tomorrow. You can see all the media buzz, the hashtags and the facebook shares flying on the internet. It is certainly a big event, all the successful Filipino technopreneurs are coming back to help mentor local aspiring technopreneurs.

From all the chaos of working on our client projects and requirements we had to pass for Hack2Hatch, we silently deployed the new version of codetoki.com yesterday.

So what does this new version do? Let me summarize what it does exactly:

1. Companies post jobs.

2. Companies list their requirements (technical/programming skills) represented by badges.

3. Applicants who wants to apply to a specific job has to collect those badges the company required by taking on challenges (sets of programming problems presented with gamification principles).

So what happened after we deployed?

We posted a (Ruby Programmer) job for Bootyard . And after that, nothing actually happened :) We purposely didn't share or tell any of our friends to use it.  Cause we had experiments in mind (a.k.a. Lean Startup's testing assumptions).

Our experiments was this:

1. Would an applicant/entry level developer actually take the time to work on those 15 sets of problems?

2. Was our workflow (UI/UX) intuitive without any further instructions?

Today those assumptions where all tested.

We got our first application! :) Surprisingly it wasn't from an entry level developer, it was from an experienced Java developer who wanted to learn and change career as Ruby Developer.  Which somehow makes him an entry level developer for  the Ruby Language.  

So was he hirable for us?

For one thing, he was really, really interested that he finished the Ruby Mining Challenge. Compared to the resumes we received before, we would certainly choose him!

Attached is his cover letter:

There are lots of causes of neck pains. Some you can deal with, some you just ignore ( if you know what i mean *blink* ). Good thing  our mStands arrived today.

Goodbye neck pains! :)

In 1950's, the Philippines was predicted to be one of the tiger economies in Asia. Sadly, we missed the opportunity to deliver. Today, Bloomberg predicts that in 2050 the Philippines will be a Tiger economy. Let us not miss it this time.

In the tech scene, successful Pinoy technopreneurs from abroad like Dado Banatao, Winston Damarillo and Sheila Lirio Marcelo are trying to mimic the Silicon Valley environment, helping the Filipinos through mentorship and possibly funding them. Hack2Hatch as described in their website is:

Hack2Hatch is a weekend entrepreneurship camp where young startups will be mentored one-on-one by experienced investors and founders from Silicon Valley. Join us on Oct. 5-7, 2012 in Cebu City.

Last Tuesday, September 6, 2012, we attended a pre-hack2hatch party in Loft Cebu City.

Here's a perspective photo by Ademar:

"Few will have the greatness to bend history itself, but each of us can work to change a small portion of events, and in the total of all those acts will be written the history of this generation."

- Robert F. Kennedy 

"Iilan ang magiging dakila sa pagbali ng kasaysayan, subalit bawat isa sa atin ay maaaring kumilos, gaano man kaliit, para ibahin ang takbo ng mga pangyayari. Kapag pinagsama-sama ang ating munting pagkilos, makalilikha tayo ng totalidad na magmamarka sa kabuuan ng kasaysayan ng henerasyong ito."

- translated by Tito Sotto

How to make a mess

When we use rails scaffold, it provides us a single coffescript named after the controller we created with scaffold. 

Example:

Ademar-Tutors-MacBook-Pro:blog_app ademartutor$ rails generate scaffold Blog title:string body:text

Automatically we put all our coffeescript code used by the blogs controller pages on blogs.js.coffee.

At first it's not something that we should we worry about since it is only a few lines of code that can easily be read. But when that 2 or 3 lines of coffescript grows into a 50 plus lines of code, it becomes an entirely different beast.

How to organize

To organize the coffeescript files, i've separated them by methods of controllers and logically (through classes).

Step 1:

In your application.html.haml (.erb if your not using haml) on you body tag add these attributes:

%body{ "data-controller" => controller_name, "data-action" => action_name }

Step 2:

Create an apps.js.coffee ( this instantiate the specific coffeescript class used on the method controller )

Here's is a sample apps.js.coffee file:

APP = # Instantiate coffescripts common to all/most of your apps pages common: init: -> new flashMessage new CornersBrowser new fancyBox new tinyEditor new tipsy new confirmDelete # kids and messages are controllers kids: # index is a method of the kids controller index: -> # you instantiate a coffeescript class used # on a specific page of your app new kidPopup messages: new: -> new recipient new attachment new input # Does the following: # 1. Gets the current controller and method name # 2. Executes the "common" coffeescripts that will be # used on all pages of the app ( see code common # method above ) # 3. Instantiates the specific coffeescript classes # determined by the controller name and method UTIL = exec: (controller, action) -> ns = APP action = (if (action is `undefined`) then "init" else action) ns[controller][action]() if controller isnt "" and ns[controller] and typeof ns[controller][action] is "function" init: -> body = document.body controller = body.getAttribute("data-controller") action = body.getAttribute("data-action") UTIL.exec "common" UTIL.exec controller UTIL.exec controller, action $(document).ready -> UTIL.init()

Here's a sample class that was instatiated on apps.js.coffee:

# Filename: tipsy.js.coffee class window.tipsy constructor: -> $('.tipsy').tipsy gravity: $.fn.tipsy.autoNS fade: true

Note:

I also organize the coffeescript files like this:

app/assets/javascripts/ apps.js.coffee common/ -- common coffeescript files used all throughout the app controller/ blogs/ -- coffeescript files used in the blog controllers plugins/ -- put all plugins you use here

Now that's how I organize coffeescript files. Hopefully this will give you an idea on how to organize your coffeescript files.

Sources:

http://www.stakelon.com/blog/2011/12/coffeescript-organizing-classes-in-separate-files/

http://www.manas.com.ar/spalladino/2012/05/20/organizing-coffeescript-code-in-a-rails-3-app/

http://coffeescript.org/

There is one source where I got the apps.js.coffee, I'll update this post the moment I remember it :)

HyperText Markup Language (HTML), played a vital role in making the web a better place to hang out. Imagine if the web looks so dull, who wants to stay in front of our screens all day long? Who would enjoy browsing sites, listening and viewing videos? With the fast advancement of technology, the demand for a better coding experience in creating web pages had pushed HTML to its limit and thus, a better version was created in the new HTML5.

So what's new in HTML5? 

Here, I give you a brief overview on what's in store for you when you use HTML5.  <!DOCTYPE html>  Yes, you may now use <!DOCTYPE html>. This one is so much better than the old one. It's shorter and easier to remember. ;) Semantic Elements Ideally, semantic elements should describe their purpose clearly making it easier for developers to understand. However, there are tags that don't have any meaning like the <div> tag. We commonly use IDs or declare class names (div class="header") to the <div> tags to give meaning to it.   In HTML5, new semantic elements were released to convey clearly the purpose of the elements. Here are a few examples of the new elements in HTML5:

<header> - header

<footer> - footer

<section> - section

<nav> - navigation 

<article> - article

Audio and Video tags The ability to support audio and video is also new in HTML5 making it is easier for developers to add video and audio using the tags <video> and <audio>. Another good thing about the audio and video elements is that it is supported in all major browsers. 

HTML5 Applications

Web and mobile development is so much easier with HTML5.  Here are some of the features added that makes the whole development process easier. 

Local data storage API

Geolocation API

Local file access

Local SQL database

Application cache

Javascript workers

XHTMLHttpRequest 2

HTML5 uses CSS3 With the new HTML5, drawing graphics and creating some cool effects are much easier. Here are few elements added:

New Selectors

New Properties

Animations

2D/3D Transformations

Rounded Corners

Shadow Effects

Downloadable Fonts

Note: I'll explain further what's new in CSS3 in my next blog so stay tuned! There, I gave you a brief overview on what's new in HTML5. There's a whole lot more of new stuffs so research some more. 

Real web designers code their own designs. If they don't know yet, they will learn. And you'll never know how if you won't try and figure it out yourself. 

We (me and honee) are currently a two-person team now at Bootyard since Gerda left and our interns focused more on their studies.

Honee and I have been working together on a lot of stuff before. We've tried exporting goods internationally, trading goods at the national level, ventured on food and renewable resources business.  But Bootyard is something new, instead of trading stuff, we have to build stuff (our product or projects for other people) for people to pay us. 

 For clarification, please see translation below:

So how do we go about this? Based from our past experience, you need to invest on the stuff that matters to the business.  Investment doesn't necessarily have to be money.  Taking a look at our experience:

Investing on skills is what we really need for Bootyard to profit well. Skills on software development (Ruby on Rails, iOS, Android and sooooo much more), system administration, UI/UX designing, bargaining with clients, business development, handling employee morale ( mine and honee's ) and the list goes on and on. It may take up the rest of our lives to master them all but hey: 

                                          "The Journey is the Reward."

  PS: Yup, we already have ourselves as investors. ;)

Last June 14, 2012, we were invited to present Codetoki idea and share our experience in participating startup competitions to PSIA (Philippine Software Industry Association) members of PD/SIG (Product Development and Special Interest Group). The meeting was held at the Asian Institute of Management in Makati.

The first speaker was Ms. Maoi Arroyo, Founder and CEO of Hybridigm Consulting Inc., the Philippines' first Bio-tech consulting firm. She talked about the aspects of commercialization. It was great to know that there is a Bio-tech consulting firm in the Philippines. Very inspiring.

Sir Earl Martin Valencia, VP/Head of Corporate Development Innovation at SMART Communications shared his experience handling a small team inside a big company. His team had a budget of $2,500 only but they were able to meet their goals. Another interesting info about Sir Earl was that he was a rocket scientist at Raytheon Space and Airborne Systems. Really amazing!  

Ms. Ito Gruet, VP-Business Development at Computer Professionals, Inc., shared her experience and insights on the New Zealand Product Development Ecosystem. 

And lastly, Mr. Arup Maity, CEO of BlastAsia, talked about the Lean Startup and Product Development. 

And here's me talking about Startup Weekend Cebu and the idea behind Codetoki.

This could not be possible without the help of Sir Alvin of Microsoft. Thank you so much Sir Alvin! :)

- Honee

This is part 2 of our experience in Manila last June. Despite our limited time, we were able to learn many things. We're so happy to bring with us all the learnings from the people in the IT industry. 

Pointwest Technologies

One company we were able to visit was Pointwest Technologies in Makati. Ms. Ma. Cristina "Beng" Coronel, President of Pointwest Technologies, was very warm and helpful in giving us insights on how we can improve Codetoki. Her story on how she started her company was also very inspiring. Not only that, her company shows that they are a proud Filipino IT firm.  

Microsoft

After our meeting in Pointwest, Sir Alvin invited us to go to Microsoft. He offered us an available room to prepare for our presentation in PSIA that afternoon. What's cool about Microsoft office rooms? It has built-in sensors where the light turns off when no motion is detected. You have to wave your hands or move around so the light turns on. Cool isn't it? :D Yea, we think it's super cool too. hehe

Here's the giant Microsoft name.

Orange & Bronze

We were also given a chance to meet Sir Calen Legazpi, CEO of Orange & Bronze. Sir Calen shared to us how he and his partner started their company. I can say he really shared the best advice ever about starting a business. Having experienced all the struggles in starting and growing a company, he's truly inspirational. We learned a lot from him about bootstrapping the business.    

O&B office occupies four floors  and this is what you can see in the 4th floor. In every floor you can see a different set-up of the space. Really a homey place to work.

All the meetings and office visits this day were made possible by Sir Alvin of Microsoft. Thank so much Sir Alvin! :)

Note: If you haven't read Part 1, here's the link.

Last June 13 - 15, we (Ademar, Sir Jeff of CeBuinIT and I) went to Manila. We only had 3 days so we wasted no time and visited the startup incubation centers in Manila. We went to UP Diliman and visited 4 incubation facilities: UP-AYALA TBI, Open TBI, UP Enterprise and Ayala TBI.

First stop is in UP Diliman, the UP-AYALA TBI. This is the first startup incubator in Manila.

Here's the list of startups in UP-AYALA TBI.

Second stop is in Open TBI. This is where the startups for incubation program located. I was really impressed by this facility. Why? Look closely at the picture below. You see a two-story building, but the amazing part is it is made of "container vans". 

Here are some of the companies incubated in Open TBI. Take note, most of the companies incubated in Open TBI are already earning from local and/or foreign clients. 

Third stop is in UP Enterprise. Their focus is on the pre-incubation program for startups that means from idea to creating an MVP (minimum viable product). Once you graduate in UP Enterprise, the companies can opt to continue their incubation program in Open TBI. 

Take a tour at their pre-incubation shared office.

Fourth stop is in Ayala TBI in UP-AYALA Technohub. They offer incubation program for startups. Take note, most of the companies here are already earning.

Here are some of the locators in AYALA TBI. One founder we were able to talk to was from BabyPips.com. His business is earning and they're building another product, still under the incubation program of Ayala TBI.

Since we're already in Manila, we joined Startup Weekend Manila FTW. We heard a lot of great ideas from the SWManila participants and updates on their startups. Some teams are already disolved, some are continuing their efforts, some have pivoted from their original idea and whole lot more of interesting updates. :) 

So, here's what happened in our first day in Manila. We were really inspired by the stories of the startups. It's exciting to know that the tech community in Manila is very vibrant. Hope you learned something about the startup scene in Manila. :)

Enjoy!

P.S. Sorry for the very late post. Hope you still find this relevant. ;)

In the past month, a lot of changes has happened to Bootyard. Some were great some not so great but today would stand out from all of them. One of Bootyard's original team member, Gerda Decio, is officially leaving Bootyard to go back to Samar and manage their family business. 

It's a very sad day for us, especially for me since I was working with Gerda ever since I got paid for programming.  There were tons of great memories that we shared. Let me share a few of them:

From Pre-Bootyard days

Bootyard in our shared office

Planning for 2012 ( excuse my newly found biceps ;) )

Transferred to another office due to confidential reasons that only the three of us knows ;)

We were supposed to leave the office early because it was a Friday! Unfortunately, a last minute deploy made us leave the office at 12:00 am of Saturday :)

First official Bootyard office.

I was supposed to dig soil for our office plants, but I was still dizzy that morning due to Friday night activities, I forced Gerda to dig them up! >:)

Professionally saving Gerda's mac with a scotch tape.

The next day! Unboxing of Gerda's new mac! :)

Summer with interns!

We've shared a lot of good times together and it was a pleasure working with Gerda. I will never forget the techniques and good practices you shared about front-end development.

 I wish you luck on your new endeavors! See you when our paths cross again! :)

Foodtoki is a startup idea of Bootyard. It is an online food directory for food establishments located in popular tourist destinations in the Philippines. And we will start by building a food directory for Cebu.

I believe that it’s better to explain things visually so instead of creating a powerpoint presentation, I made a video. So here’s a short animation explaining what Foodtoki is all about. The animation cast are Pen as “The Tourist” and Pilot as “The Chef”. 

The video was presented during the graduation of the 2nd Batch of the Pre-Incubation Program of CeBuinIT last June 29, 2012 in UP Cebu AVR. 

P.S. This video animation was made a day before the event with no prior knowledge how to animate things so please keep your expectations low. hehe ;)