WebTech | Prepys' Homepage

New #30DayChallenge: Write in Markdown

October 8, 2013October 8, 2013 Max Limpag Leave a comment

I’ve always wanted to learn and start using Markdown in writing. For some time, it hovered near the top of my to-do list but I never got around to actually starting to use it.

I use a Markdown-capable online writing tool – Editorially – but I never used it for that. I used it purely to manage articles and to allow me to work on a post in multiple workstations.

When I write, I compose only in plain text. As soon as I’d finish the article, I’d go over the post again and manually code the HTML tags for blog or website publishing.

Markdown, a “lightweight markup language” created by a writer – John Gruber, simplifies that. It allows you to to easily mark up documents and export these into structurally valid HTML.

I’ve always filed using Markdown as one of the tasks I’d do in a future #30DayChallenge.

I finally got around to using it more extensively this month when I became more active in using Github to manage my projects and work files. I fully realized its utility when I started processing the Sun.Star Cebu News Style Guide and uploading it to its repo so that newsroom editors and reporters could start working to update and improve it in preparation for turning it into a mobile app.

MARKDOWN. It took me days to code this dated Sun.Star Cebu Style Guide in HTML. With Markdown, it took me hours. If you do a lot of writing, especially for digital media, Markdown is something you should consider using.

If you do a lot of writing, especially for digital media, Markdown is something you should consider using.

It took me days to manually code the old version of the Sun.Star Cebu style guide in HTML. With Markdown, it took me hours.

What’s more, Markdown is easy to do – it’s something I can ask other editors and reporters in the newsroom to use in updating our style guide. After introducing them to Git, anyway. But hey, our editor-in-chief now uses Github.

There are many Markdown editors available for free download. On the Mac, my favorite is Mou. On Windows, it’s MarkdownPad. On my Elementary OS Linux desktop, I just use an online Markdown editor like Dillinger or Markable. Here’s an exhaustive list if you want to try out other editors. Here’s the Markdown syntax reference if you’re interested.

As part of my 30-Day Challenge this month, I plan to use Markdown in all my writings and create a workflow that fits my needs.

Share on Facebook Retweet this

The post New #30DayChallenge: Write in Markdown appeared first on Leon Kilat : The Tech Experiments.

Tech as enabling disaster preparedness: APSEMO experience

July 21, 2013July 21, 2013 Max Limpag Leave a comment

Share on Facebook Retweet this

WERE you among the hundreds of people stranded in parts of Metro Cebu Saturday night? A strong and sudden downpour caused waist-deep flooding in several areas of the metro.

Flooding has now become all too common not just because of the sorry state of our drainage system and our explosive growth but also because of the weather. Climate change is upon us and its bringing disasters along with it.

One thing that empowers communities in dealing with disasters like widespread urban flooding is technology.

Before technologies like mobile phones came in, disaster preparation was a “failure,” said Dr. Cedric Daep, the head of the Albay Public Safety and Emergency Management Office (Apsemo)

Even if you have a good early warning system, you can’t evacuate people without communications, Daep said in an interview last July 5 when he was in Cebu to work on the customization of Tudlo, a disaster-preparedness and response mobile phone app.

DISASTER PREPAREDNESS. Dr. Cedric Daep (left), head of the Albay Public Safety and Emergency Management Office (APSEMO), writes down tips on disaster preparedness and response for inclusion in the Tudlo app by its dev team. Also in photo is Nova Clotario-Concepcion, head of Smart’s Community Partnership-Public Affairs Group. (Photo by Max Limpag)

Albay is known for its effective and successful disaster preparedness and response program. Zero casualties, Dr. Daep proudly pointed out. And technology plays a central role in this, he said.

Infoboard alert system

The province uses the SMS-based Infoboard service by Smart Communications, Inc. Dr. Daep credits the service for their “zero-casualty” disaster response “because of the spread of information.”

When they suspend classes, the information is quickly spread throughout the province via text messages. And any information sent by the Infoboard system is deemed official, based on a Provincial Board ordinance.

Daep said the system allows them to quickly warn people against potential hazards and disasters and advice them on what to do to be safe.

Best Disaster Response App winner

Apsemo’s disaster response is about to get yet another technological boost through Tudlo, an app developed by a Cebu-based team led by Vince Loremia that won as Best Disaster Response App during the #SmartActs Cebu: A Hackathon for Social Good last September 2012.

Albay is the Cebu team’s first LGU partner for the application.

The name Tudlo comes from the Visayan word for “teach,” “point” and “guide” and it does all that in responding to disasters. It serves as a “disaster dictionary,” a mobile guide that teaches people how to respond to different hazards, said Dr. Daep. During a disaster, Loremia said in his pitch for the app, Tudlo can point people to where they could evacuate safely and then guide them during rescue and reconstruction.

Dr. Daep was in Cebu earlier this month to lead the Tudlo team in customizing the content for the app. He translated the guide into Bicolano and added tips that are both based on scientific studies as well as indigenous knowledge.

Among the tips there is how to check wind direction to ascertain whether a typhoon will hit your place. Dr. Daep also shared how one needs to close windows and doors that are facing the wind of a coming typhoon but make sure doors and windows in the opposite side are open to allow air to come in to counteract the vacuum effect and make sure your roof isn’t blown away. This information will be in Tudlo along with a lot of other tips.

Key role in reporting, needs assessment

Dr. Daep is deeply enthusiastic for Tudlo and he sees it deployed in a month or two, taking advantage of Albay’s existing disaster-response network. With the app, people will be able to report hazard situations and get immediate feedback on government action and response.

He sees the app playing a key role in the future in damage and needs assessment. Dr. Daep said the app will enable control centers to get a consolidated assessment report coming from the different communities within 24 hours. The current procedure involves sending consolidated teams of agri, social welfare, engineering and health personnel to the field, which takes time and a lot of resources. With Tudo, reports from the communities will come in “like results during an election.”

He said communities using tools like Tudlo won’t need rescue. Even before a disaster strikes, the system has already triggered a mass alert to bring people to safer areas.

Share on Facebook Retweet this

The post Tech as enabling disaster preparedness: APSEMO experience appeared first on Leon Kilat : The Tech Experiments.

Learning to build mobile sites, from WAP to JQuery Mobile

May 28, 2013May 28, 2013 Max Limpag Leave a comment

Share on Facebook Retweet this

EASY, POWERFUL FRAMEWORK. JQuery Mobile allows non-programmers like me to easily and quickly build powerful mobile Web apps and sites. (Photo by Max Limpag)

About ten years ago, I built a WAP (Wireless Application Protocol) mobile news site. This was at a time when the cellphone to aspire for was the Nokia 7110, a slider phone made even cooler when a similar device was used in the Matrix movie.

At that time, the Sun.Star website signed a content agreement with Smart for SMS and WAP news and they needed a WAP mobile site. Nobody among the website staff then knew how to build a WAP site. Being a sucker for always trying to learn new stuff, I volunteered to build it.

I finished the WAP site in time for the launch after a 3-day development marathon done after I finished my work at the Sun.Star Cebu copy desk, fueled by more than a pack of Marlboro reds a day (I was still a heavy smoker then) and guided by a phonebook-thick Wireless Markup Language (WML) reference for the Artus Netgate.

Updating was by manual editing of codes but somebody later hacked a rudimentary content management system to simplify changing the content in the WML files.

Boy, was it ugly. I don’t know if people still recall browsing using WAP but the system was a limited, text-based interface to mobile information.

WAP sites were made of decks of WML cards. And since phones then did not have the memory spaces that we have now, the cards could only contain limited characters — enough for a headline and about 3 paragraphs of the article. You go through this deck of WML cards as you navigate the WAP site.

Here is a snippet of the main page of the site with a sample of 2 cards. What it did is flash the text “22 papers all over the country” and then “12 affiliates online” before opening the “Enter” screen where you could click to go to the menu of viewing news, events or movie skeds.

<?xml version=”1.0″?>
<!DOCTYPE wml PUBLIC “-//WAPFORUM//DTD WML 1.1//EN” “http://www.wapforum.org/DTD/wml_1.1.xml”>
<wml>
<!– SUN-STAR WAP –>
<card id=”splash1″ ontimer=”#splash2″ title=”Sun.Star Network” newcontext=”false”>
<timer value=”10″/>

<big>22 papers all over the country</big> 

</card>

<card id=”splash2″ ontimer=”#splash3″ title=”Sun.Star Network” newcontext=”false”>
<timer value=”10″/>

<big>12 affiliates online</big> 

</card>

</wml>

WAP. The Sun.Star WAP site, built during the heydays of the Nokia 7110. WAP was built on decks of cards contained in WML pages. (Photo by Max Limpag)

I was reminded of this card interface when I started studying last week to build mobile websites and HTML apps using JQuery Mobile.

JQuery Mobile allows you to build multi-page mobile sites or apps on a single HTML file by breaking it into “pages,” akin to the WML cards.

But the similarities end there. JQuery Mobile is so much more powerful and yet still simple to use for a non-programmer like me. I cannot code, not even if my life depended on it. What I can do is cobble together frameworks to build stuff that I need for my projects.

To study JQuery Mobile, I built a mobile Web app for the Sun.Star Cebu central newsroom.

I wanted to revive the newsroom’s Style Guide, which advises Sun.Star Cebu journalist on usage and style in writing. The documented is a bit dated, it was written back when the paper still preferred the shorter spelling of words and thus used “kidnaped” instead of “kidnapped.”

But I still find the document useful and wanted ready access to it. I already set up a newsroom wiki to host the style guide in our local intranet but I thought it would be much more useful if it could be turned into a mobile app that a Sun.Star journalist can consult on the field.

I went through the JQuery Mobile API documentation, which is available online and as an iPhone app, and built a mobile Web app for the Style Guide. After I finished the guide, I realized I could just expand the app to make it even more useful to Sun.Star Cebu journalists by including writing tips and embedding our Twitter timeline so everyone would know the latest updates of the official @sunstarcebu account.

It says a lot about the power and simplicity of JQuery Mobile that a non-programmer like me was able to build what I wanted built in less than a day. I’m now looking into turning it into a native Android, iOS and BlackBerry apps (crossing my fingers).

As a journalist who grew up and started working before I had access to the Internet, I am continually amazed by this empowering ability of Web technology.

Open source technologies like WordPress (which just celebrated its 10th year) and JQuery Mobile are empowering to independent community journalists like me (my InnoPub persona), who do not have access to a dedicated development team.With the world going mobile, frameworks like JQuery Mobile are such a big boost for startups and smaller companies.

Share on Facebook Retweet this

The post Learning to build mobile sites, from WAP to JQuery Mobile appeared first on Leon Kilat : The Tech Experiments.

Why Flickr is awesome again

May 26, 2013May 26, 2013 Max Limpag Leave a comment

Share on Facebook Retweet this

flickr

A free terabyte of storage. A thousand gigabytes. That’s how Flickr announced it was back in the photo hosting game.

Last week, Yahoo chief executive officer Marissa Mayer announced that the Internet pioneer is giving users of its photo sharing service Flickr a terabyte of free storage. That amount of free space boggles one’s mind.

To show it off, Flickr has a slider on its homepage that allows you to calculate how many photos you can store in your free allocation, depending on the resolution. If you store 8-megapixel pictures, the resolution of the iPhone 5, you could store up 436,906 photos.

‘Enough for a lifetime’

“That’s enough for a lifetime of photos — more than 500,000 original, full-resolution, pixel-perfect, brilliant photos. Flickr users will never have to worry about running out of space,” Mayer said in her post on Yahoo’s Tumblr, a platform that the company purchased at about the same time they announced the changes in Flickr, for over a billion dollars.

To put that free storage into context, the biggest free online storage I was able to sign up to is the 25 gigabytes I have with Box.net for signing up via an Android phone. A regular Box.net account offers only 5gb of free storage. Dropbox also offers 5gb of free storage with opportunities to increase it by inviting friends to use the service.

Reaction to the announcement is close to the response to when Gmail announced it was offering 1GB of storage to its free e-mail service on April 1, 2004. The announcement was made at a time when people had 2MB of storage for their free email accounts. But then years later, the other email providers also ramped up their storage. I think that would also happen in the photo storage service sector. Google, for example, already offers unlimited photo storage but only for standard size images of 2048 pixels at the longest edge. Here’s hoping they would remove that size limit.

Yahoo also announced a redesign of what had previously been an abandoned web property, adding the ability to share photos in full resolution and lifting the 200-photo limit imposed on the photostream of free members.

As soon as the announcement was made, I opened my Flickr account again after months of not visiting it. The most recent time that I reopened it was when Yahoo! released its Flickr app for the iPhone. I was given three months of Pro upgrade for free but was told that at the expiration, the 200-photo limit on the photostream would be imposed again.

Old Skool member

The Flickr of old is the poster child of what went wrong in Yahoo. The site was a trail-blazing service that had a strong following among its users. After it was bought by Yahoo, the service suffered.

I was part of the so-called “Old Skool” members, what the company called those who joined before it was purchased by Yahoo. I joined Flickr in August 2004 and used it not just for hosting personal photos but also those that I used in my blog.

Many bloggers also used Flickr for mobile posting because the service allowed you to automatically create a new photo post every time you email it an image for uploading.

But after years of stagnation, users left the service in favor of new sites and applications. For a time, I transferred to Zooomr, a similar service that was built by a teener out to prove that he could create a Flickr clone. That site, along with many of my photos, is now gone.

Sites like Instagram and Path then took over the photo sharing service while Flickr lay abandoned by Yahoo. Mayer referenced what happened to Flickr in her announcement of the purchase of Tumblr, “we promise not to screw it up.”

The Flickr of new is the poster child of a resurgent Yahoo.

When the company announced Mayer’s appointment last year, somebody spoke for the Flickr faithful by putting up a one-page site at dearmarissamayer.com asking her to make Flickr awesome again.

I think the site speaks for many of us when it now says: Dear Marissa Mayer, THANK YOU FOR MAKING flickr AWESOME AGAIN. ♥ the internet.

Share on Facebook Retweet this

The post Why Flickr is awesome again appeared first on Leon Kilat : The Tech Experiments.

Lapu-Lapu mayor offers State Of The City Address e-book for download via phone scanning

July 25, 2012July 25, 2012 Max Limpag Leave a comment

Share on Facebook Retweet this

STATE OF CITY SPEECH AS EBOOK. Scan the code to download Mayor Paz Radaza’s State Of The City Address. CLICK ON PHOTO TO ENLARGE.

Lapu-Lapu City Mayor Paz Radaza will be giving her State Of The City Address in Hoops Dome in Lapu-Lapu City this morning. What’s different about her speech today — from her previous ones and from the speeches local government executives have been giving and will be giving this month — is its digital twist — the speech can be downloaded as an e-book via phone scanning at the venue.

Radaza’s team at City Hall asked InnoPub Media, the journalism start-up I co-founded with my wife, Marlen, to set up a system that will allow the City Government to offer the mayor’s speech as a downloadable report.

InnoPub created the e-book (which you can download directly here) and set up a download system via QR or quick response code scanning.

Lapu-Lapu City will also launch today it’s own version of “A Guide To Cebu 2012,” the electronic guidebook on Cebu published by InnoPub Media with the strong support of Smart Communications, Inc. and partners like Ayala Center Cebu, Marco Polo Plaza Cebu, The Islands Group, Department of Tourism, Cebu City Government, among other partners.

The downloadable e-books are just the start of digital initiatives in Lapu-Lapu City. More initiatives done in partnership with InnoPub Media will be announced in the coming days.

Share on Facebook Retweet this

The post Lapu-Lapu mayor offers State Of The City Address e-book for download via phone scanning appeared first on Leon Kilat : The Tech Experiments.