What's new

[Chia sẻ] Cùng tạo nên ứng dụng Phượt

sntran

Phượt tử
Chào các bạn,

Mình tên Sơn, là lập trình viên, nhưng rất thích đi, và cũng đã đi rất nhiều nơi. Trước mỗi chuyến đi, mình toàn lên một lịch trình tổng quát (như là sẽ ghé qua các tỉnh nào, các địa điểm nào, ăn món gì, ở đâu, v.v... chứ không quá chi tiết), để cùng những người đi cùng thảo luận, thay đổi. Nhưng quan trọng hết là mình muốn có được một cái thể hiện được mình đang đi đâu, để cho bạn bè và gia đình theo dõi, dè chừng dùm mình.

Cho tới thời điểm này, mình dùng tổng hợp rất nhiều dịch vụ: Google My Maps (https://www.google.com/maps/d/), TripLine (http://www.tripline.net/), và thậm chí Google Docs, nhưng chưa tìm được cái nào vừa ý.

Do đó, mình nghĩ đến việc làm một dịch vụ phục vụ cho đúng nhu cầu của mình, và cũng có thể cho rất nhiều bạn trong cộng đồng Phượt này. Do một mình mình làm không xuể, và muốn kêu gọi mọi người cùng đóng góp ý kiến và công sức để cùng làm ra một ứng dụng thật tốt, phục vụ được cho nhiều người dùng.

Ý tưởng sơ bộ của mình như sau (https://gist.github.com/sntran/25178466755904f65a00093acb5065be):

## Mô hình:

Một trang web và chuyển đổi thành ứng dụng di động. Cả 2 đều phục vụ tạo lịch trình, chia sẻ lịch trình, thảo luận và theo dõi lịch trình...

## Chức năng dành cho người đi Phượt

### Trước chuyến đi

- Tạo chuyến đi.
- Thêm người đi cùng, người lên lịch trình cùng, người sẽ nhận được thông báo trong tình huống khẩn cấp.
- Điền thông tin chi tiết từng chặng đi: nơi xuất phát, thời gian xuất phát, nơi đến, thời gian đến, thời gian lưu trú, phương tiện di chuyển từng chặng, ... (1)
- Xem và thay đổi tuyến đường cho từng chặng trên bản đồ bằng cách kéo thả.
- Nhận được gợi ý về chi phí xăng cộ, ăn, ở, và có thể thay đổi nếu cần (2).
- Chia sẻ chuyến đi lên các mạng xã hội.

### Trong chuyến đi

- Bật chế độ lưu giữ GPS khi di chuyển nếu muốn, không nhất thiết (3).
- Checkin nơi mình đang dừng chân (4).
- Thêm hình ảnh, video, ghi chú (âm thanh và/hoặc chữ) tại nơi checkin.
- Người đồng hành cũng có thể thêm thông tin, như một cuộc thảo luận.
- Tìm gợi ý quán ăn, nhà nghỉ, cây xăng xung quanh mình.
- Điền thông tin chi phí linh hoạt (món A giá 30k, xăng lần 1 hết 50k,...)

- Một nút bấm/cử chỉ để kích hoạt cầu cứu.
- Nhận được nhắc nhở khi ứng dụng cảm thấy không di chuyển trong một thời gian dài, không khớp lịch trình, không có hoạt động sử dụng điện thoại trong một thời gian, hoặc một cử chỉ nào đó được kích hoạt (ví dụ lắc điện thoại 3 lần - thiếp lập theo người dùng). Nếu người dùng không tương tác với nhắc nhở, ứng dụng sẽ tự động gửi thông báo khẩn cấp đến người quen.

### Sau chuyến đi

- Xem tổng kết quãng đường, tuyến đi, thời gian, chi phí...
- Bổ sung thông tin cho bất kì địa điểm nào trên chuyến đi.

## Chức năng dành cho bạn bè, người thân

- Xem tất cả các chuyến đi của tất cả mọi người trên một bản đồ trên trang chủ của dịch vụ theo gần thời gian thật (5)
- Xem chi tiết một chuyến đi trên bản đồ: chặng đường, timeline, chi phí, theo gần thời gian thật (5).
- Bản đồ chi tiết hiển thị như một trình xem phim, người dùng có thể để tự chạy, hoặc đi nhanh từng chặng, hoặc lùi lại những chặng trước, hoặc dừng lại để đọc.
- Đăng ký nhận thông báo khi người đi Phượt đến một chặng nào đó.
- Yêu cầu tham gia cùng một chuyến đi.
- Bình luận, like, theo dõi một Phượt thủ hay chuyến đi.
- Chia sẻ chuyến đi lên các mạng xã hội.
- Tạo một chuyến đi mới tương tự.

## Ghi chú:

(1) Những thông tin này, tuy không cần chính xác, nhưng cần thiết cho các ước tính của hệ thống sau này như ước tính quãng đường, địa điểm, chi phí dự tính...

(2) Dựa vào những thông tin tại (1), cũng như thông tin từ các chuyến đi khác đã thực hiện, có thể ước tính được quãng đường bao nhiêu, đi với xe máy X thì sẽ tốn Y lít xăng, x với giá xăng hiện tại, ra chi phí xăng. Tương tự với ăn ở, khi biết được thời gian đi và đến, có thể ước tính được là sẽ cần ăn trưa hoặc tối, hoặc uống nước dọc đường, hoặc cần nghỉ đêm khi nào. Ví dụ, đi từ A lúc 5h sáng, tới B lúc 4h chiều, thì ước tính là sẽ nghỉ uống nước lúc 9h sáng, tại vị trí X = 4 tiếng x 60 (vận tốc trung bình xe máy) = 240 km, và sẽ ăn trưa lúc 12h tại vị trí Y = (7 tiếng - 15 phút uống nước) * 60 = 405km. Tại vị trí Y có quán ăn A, B, C, giá món ăn dao động khoảng 30-40k, ra chi phí ăn uống.

(3) Do có được thông tin tại (1), và như ví dụ ở (2), chúng ta có thể ước tính được người đi đang ở đâu mà không cần họ phải bật ứng dụng trên điện thoại liên tục tốn pin. Ứng dụng của chúng ta sẽ tự động chuyển đổi trạng thái chuyến đi thành bắt đầu khi ngày giờ khớp với thời gian đi đặt ra bởi người đi, và tự động cập nhập sau vài phút, cho tới khi chuyến đi kết thúc hoặc (4) xảy ra.

(4) Do thông tin trong chuyến đi là dự đoán, sẽ tốt hơn nếu người đi chịu khó checkin thường xuyên. Khi người đi check in qua ứng dụng, hệ thống sẽ dùng vị trí checkin để tính toán, điều chỉnh lại vị trí trên bản đồ. Dĩ nhiên nếu người dùng bật (3) thì thông tin sẽ chính xác hơn, nhưng mình nghĩ, dựa vào kinh nghiệm bản thân, khi mình đi, chủ yếu là chạy thẳng. Nếu đã dừng thì thường là lấy điện thoại ra checkin, chụp hình, nên cũng không chênh lệch so với dự đoán nhiều, mà người dùng sử dụng cũng không cảm thấy phiền hà, vì đều là những thao tác quen thuộc. Cũng ghi chú luôn là ứng dụng có thể hoạt động hỗ trợ checkin mà không cần tới 3G. Thông tin sẽ được lưu lại trên phone, và sẽ được tải lên máy chủ khi người dùng kết nối được Internet.

(5) Bản đồ trên trang chủ sẽ hiển thị vị trí người đi. Như đã đề cập ở các ghi chú trên, bản đồ sẽ luôn cập nhật, nhưng không hẳn là chính xác, nên chỉ có thể là "gần thời gian thật".

## Justification and Gamification

Cũng như tất cả các ứng dụng khác, muốn được phổ biến thì cần có những yếu tố thu hút và có sức lan toả. Dưới đây là một số ý tưởng:

### Chia sẻ qua mạng xã hội

Điều này không mới mẻ, nhưng nếu có thể, chúng ta tìm cách để người dùng có thể embed bản đồ lên Facebook, Twitter và bản đồ này tự động cập nhật. Điều này có thể khó với Facebook, vì nếu dùng iframe như YouTube thì sẽ không tự động chạy, còn làm theo kiểu ảnh GIF hay ảnh truy xuất dữ liệu từ máy chủ thì không được do Facebook cache link.

Nhưng do tính chất là gần hết các tính năng là dành cho người đi, chúng ta sẽ không gặp vấn đề Gà và Trứng khi sử dụng tính năng chia sẻ. Chúng ta chỉ cần làm sao để người dùng mở link chuyến đi sẽ cảm thấy hứng thú và chia sẻ lại, thì như vậy mới lan toả.

### Leaderboard

Mỗi một chuyến đi sẽ được đánh giá và cho điểm người đi. Càng đi nhiều thì càng nhiều điểm. Top 10 hay 100 người đi nhiều nhất sẽ nằm trong bảng xếp hạng trên trang chủ cho mọi người cùng xem.

Ngoài ra, nếu bạn đi trên một tuyến đường chưa ai từng đi, thì điểm sẽ được nhân lên.

Bảng xếp hạng sẽ được reset theo tháng hay quý hay nửa năm, tuỳ lượng sử dụng.

Nếu điều kiện tài chính cho phép thì có thể tặng quà.

### Competitions

Tổ chức những cuộc thi phượt nhằm kêu gọi mọi người đóng góp hình ảnh, tư liệu, thông tin cho hệ thống.

Ý tưởng ban đầu sẽ là tổ chức chuyến đi trong 2 tuần, ai đăng ký sẽ đặt cọc một số tiền, và được cấp 1 GoPro hay Phantom để sử dụng trong chuyến đi. Thành viên nào đi qua nhiê chụp hoặc quay được nhiều ảnh hoặc video đẹp và thú vị sau chuyến đi sẽ thắng giải và giữ lại GoPro hay Phantom đó.

## Thông tin kỹ thuật

Dưới đây là một chút thông tin kỹ thuật cho những ai hứng thú:

### Frontend

- React.js cho views
- GraphQL để query data tới server.
- Relay hoặc Apollo client để gửi query và nhận data.
- Google Maps JS API hoặc OpenStreetMap cho bản đồ, geocode, geolocation...
- React Native cho ứng dụng điện thoại.

### Backend

- Ngôn ngữ Elixir/Erlang.
- Phoenix web framework.
- PostgreSQL hoặc graph database.

## Về bản thân

Mình tên Trần Nguyễn Sơn, sinh năm 1985, làm lập trình viên về mảng web được vài năm. Mình sử dụng nhiều ngôn ngữ khác nhau, và có thể học thêm nếu cần.

Về mặt kỹ thuật, các bạn có thể xem GitHub của mình tại: https://github.com/sntran
Về mặt xã hội, các bạn có thể xem Facebook của mình tại: https://www.facebook.com/profile.php?id=100005367646651
 
Hi anh Sơn,

Không biết ứng dụng này anh định làm toàn bộ các chức năng một lần hay như thế nào ạ. Theo cá nhân em thì số lượng chức năng khá là lớn và không phải đơn giản, vì vậy nên chia thành nhiều phase để vừa làm vừa đánh giá lại tính khả thi và phù hợp của các chức năng, cũng là tránh để giai đoạn phát triển kéo dài quá lâu.
Thứ hai em nghĩ nên có một chức năng nữa là có thể tổng hợp thông tin của chuyến đi (lịch trình, thành viên) vào trong một trang khổ A4 hoặc nhiều trang, sau đó cho phép lưu thành file ảnh hoặc in ra bằng máy in để phát cho các thành viên trong đoàn theo dõi.

Em cũng từng có ý tưởng tạo một ứng dụng kiểu như thế này, nhưng thực sự thì vì công việc nên không có thời gian, khả năng code cũng hạn chế vì em là một tester ngay từ đầu chứ không phải chuyển từ developer sang, nên chỉ xin đóng góp một số ý kiến thế thôi ạ.

Hi vọng là sẽ được theo dõi từ lúc ứng dụng mới bắt đầu được xây dựng cho đến lúc nó hoàn thiện :D
 
Cảm ơn ý kiến của bạn.

Mình sẽ chia nhỏ ra từng chặng chứ bạn, nhưng mình vẫn để hết tất cả những tính năng có thể nghĩ đến ở đây để mình có 1 mục tiêu hướng tới. Phase đầu tiền thì mình sẽ nhắm đến những tính năng thiết yếu như lên lịch trình, quản lý lịch trình chung bởi những người đi cùng, cũng như theo dõi được lịch trình. Sau đó mới đi tiếp tới những thứ khác.

Mình sẽ cập nhật quá trình của sản phẩm ở đây để mọi người cùng biết và tham gia khi có thể.

Hiện mình chỉ hy vọng có ai đó có thể lên giúp wireframe dùm mình :)
 
Mockup v1

https://sntran.proto.io/share/?id=401ae932-effa-409e-992e-26216b943d32&v=1

Mockup này thể hiện giao diện của trang chủ, với bản đồ thế giới thể hiện các chuyến đi của tất cả thành viên. Bên dưới là thanh trượt để xem các chuyến đi theo ngày (không thể hiện trên mockup).

Nhấn vào từng marker (màu đen) trên bản đồ sẽ hiện 1 popup thể hiện thông tin tóm tắt về chuyến đi đó, và với nút bấm để đi đến trang thông tin cụ thể về chuyến đi.

Trên cùng là thanh công cụ, thể hiện thông tin của người dùng đang đăng nhập, cùng với dòng nhập cho phép người dùng đi nhanh đến thiết lập chuyến đi tiếp theo của mình.

Giao diện được thiết kế theo khuôn mẫu Material Design của Google.

5ZaLfjX.png


Hn3JcVT.png


WdXFPqf.png


xSdN4kU.png
 
Quick update:

Mình vừa push code mới nhất lên https://github.com/vietcode/Spoors.

Gần đây gia đình mình có một vài thay đổi nên không dành được thời gian nhiều. Tuy nhiên, mình cũng ráng làm xong được phần geocoding address để lấy địa điểm. App sẽ dùng native geocoder trên iOS và Android nên không sợ bị limit.

Về phần giao diện, mình sử dụng NavigatorExperimental component của React Native. Như tên nó nói, đây là component đang thử nghiệm, còn rất mới, nhưng nó cho phép mình làm được khá tốt phần chuyển scenes.

Giao diện mới sẽ khác nhiều so với screenshot ở trên, do mình có dành chút thời gian xem lại phần UX.

Để đi làm về mình sẽ làm cái quick screenshot cho app hiện tại.
 
Các bác cho em hỏi?
Em cần một ứng dụng chỉ đường như googmap và lại có tính năng của một chiếc bản đồ ( giấy ) hiển thị chi tiết về đường xá( có cả liên xã liên thôn đc thì tốt nhất) liệu có cái ứng dụng nào như thế ko ạ? :(
 

Hỏi Phượt

Forum statistics

Threads
56,178
Bài viết
1,150,354
Members
189,939
Latest member
chuyengiatrimun
Back
Top